vue定义global.js,挂载在vue原型上面使用
生活随笔
收集整理的這篇文章主要介紹了
vue定义global.js,挂载在vue原型上面使用
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
首先在src目錄下創(chuàng)建global目錄，在global目錄下創(chuàng)建index.js。
export default {install(Vue) {var that = this// 1. 添加全局方法或?qū)傩?/span>// ue.global = this// 2. 添加全局資源// 3. 注入組件 Vue.mixin({created() {this.global = that}})// 大于一的整數(shù)驗(yàn)證，this.$jfjl，所有驗(yàn)證方法無判空功能，如若判空，請(qǐng)用required: trueVue.prototype.$zsReg = (rule, value, callback) => {let reg = /^(([1-9]\d+)|[1-9])?$/; //大于一的整數(shù)if (reg.test(value) || !value) {callback();} else {return callback(new Error("請(qǐng)輸入大于1的整數(shù)"));}}// 金額的校驗(yàn)Vue.prototype.$jeReg = (rule, value, callback) => {if (value > 200 || value < 1) {callback(new Error("請(qǐng)輸入小于200并且大于1的數(shù)字"));} else {let reg = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/; //1-200的數(shù)字，小數(shù)點(diǎn)后保留兩位if (reg.test(value)) {callback();} else {return callback(new Error("請(qǐng)輸入正確的金額"));}}}Vue.prototype.$jeRegMax = (rule, value, callback) => {let reg = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/; //小數(shù)點(diǎn)后保留兩位if (reg.test(value) || !value) {callback();} else {return callback(new Error("請(qǐng)輸入正確的金額"));}}// 手機(jī)號(hào)的驗(yàn)證Vue.prototype.$sjhReg = (rule, value, callback) => {let reg = /^1[345789]\d{9}$/; //手機(jī)號(hào)碼正則if (reg.test(value)) {callback();} else {return callback(new Error("請(qǐng)輸入正確的手機(jī)號(hào)"));}}// 密碼校驗(yàn)Vue.prototype.$parsswordReg = (rule, value, callback) => {let reg = /^(?![0-9]*$)[a-zA-Z0-9]{6,20}$/; //密碼校驗(yàn)if (reg.test(value)) {callback();} else {return callback(new Error("密碼需要包含6-20位數(shù)字或字母，至少包含一位字母"));}}Vue.prototype.$webReg = (rule, value, callback) => {let reg = /^([hH][tT]{2}[pP]:\/\/|[hH][tT]{2}[pP][sS]:\/\/)(([A-Za-z0-9-~]+)\.)+([A-Za-z0-9-~\/])+$/; //網(wǎng)址的校驗(yàn)if (reg.test(value)) {callback();} else {return callback(new Error("鏈接地址不正確"));}}Vue.prototype.$dateFormat = (timestamp) => {var date = new Date(timestamp); //時(shí)間戳為10位需*1000，時(shí)間戳為13位的話不需乘1000var Y = date.getFullYear() + '-';var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';var s = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());return Y + M + D + h + m + s;}Vue.prototype.$dateFormatDay = (timestamp) => {var date = new Date(timestamp); //時(shí)間戳為10位需*1000，時(shí)間戳為13位的話不需乘1000var Y = date.getFullYear() + '-';var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';return Y + M + D;}} } View Code這里面是常用的幾個(gè)element-ui自定義驗(yàn)證和時(shí)間格式化的代碼，可以參考寫一下自己需要的格式化或者驗(yàn)證規(guī)則。
然后我們需要在main.js引入global，并且使用它
import global from './global' Vue.use(global)之后我們就可以直接在頁面中使用this.的方法調(diào)用這些自定義規(guī)則了。
轉(zhuǎn)載于:https://www.cnblogs.com/gitByLegend/p/11441999.html
總結(jié)
以上是生活随笔為你收集整理的vue定义global.js,挂载在vue原型上面使用的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 浅谈微信小程序生命周期
- 下一篇： uni-app相关