首先在src目錄下創建global目錄，在global目錄下創建index.js。

export default {install(Vue) {var that = this// 1. 添加全局方法或屬性// ue.global = this// 2. 添加全局資源// 3. 注入組件 Vue.mixin({created() {this.global = that}})// 大于一的整數驗證，this.$jfjl，所有驗證方法無判空功能，如若判空，請用required: trueVue.prototype.$zsReg = (rule, value, callback) => {let reg = /^(([1-9]\d+)|[1-9])?$/; //大于一的整數if (reg.test(value) || !value) {callback();} else {return callback(new Error("請輸入大于1的整數"));}}// 金額的校驗Vue.prototype.$jeReg = (rule, value, callback) => {if (value > 200 || value < 1) {callback(new Error("請輸入小于200并且大于1的數字"));} else {let reg = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/; //1-200的數字，小數點后保留兩位if (reg.test(value)) {callback();} else {return callback(new Error("請輸入正確的金額"));}}}Vue.prototype.$jeRegMax = (rule, value, callback) => {let reg = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/; //小數點后保留兩位if (reg.test(value) || !value) {callback();} else {return callback(new Error("請輸入正確的金額"));}}// 手機號的驗證Vue.prototype.$sjhReg = (rule, value, callback) => {let reg = /^1[345789]\d{9}$/; //手機號碼正則if (reg.test(value)) {callback();} else {return callback(new Error("請輸入正確的手機號"));}}// 密碼校驗Vue.prototype.$parsswordReg = (rule, value, callback) => {let reg = /^(?![0-9]*$)[a-zA-Z0-9]{6,20}$/; //密碼校驗if (reg.test(value)) {callback();} else {return callback(new Error("密碼需要包含6-20位數字或字母，至少包含一位字母"));}}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-~\/])+$/; //網址的校驗if (reg.test(value)) {callback();} else {return callback(new Error("鏈接地址不正確"));}}Vue.prototype.$dateFormat = (timestamp) => {var date = new Date(timestamp); //時間戳為10位需*1000，時間戳為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); //時間戳為10位需*1000，時間戳為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

　　這里面是常用的幾個element-ui自定義驗證和時間格式化的代碼，可以參考寫一下自己需要的格式化或者驗證規則。

　　然后我們需要在main.js引入global，并且使用它

import global from './global' Vue.use(global)

　　之后我們就可以直接在頁面中使用this.的方法調用這些自定義規則了。

轉載于:https://www.cnblogs.com/gitByLegend/p/11441999.html

總結

以上是生活随笔為你收集整理的vue定义global.js,挂载在vue原型上面使用的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。