只可读的

1、全局变量专用模块(vue调用时要导入,不用this)

1:新建一个global.js,声明变量,采用export将其暴露出来。如

const mobileReg = /(^1[0|1|2|3|4|5|6|7|8|9]\d{9}$)|(^09\d{8}$)/ //手机号,11位纯数字
const passwordReg = /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{6,15}$/ //密码,6-15位英文数字组合
const chineseReg = /[u4e00-u9fa5]/ //中文
const digitalReg = /^\d+(\.{1}\d+)?$/ //数字
const hostReg = /[a-zA-Z0-9][-a-zA-Z0-9]{0,62}(\.[a-zA-Z0-9][-a-zA-Z0-9]{0,62}|(:[0-9]{1,4}))+\.?/ //域名
const nickReg = /^[A-Za-z\d\u2E80-\u9FFF【】\[\]\(\)\-\,\,\?\?\.\。\;\:\:\;\\\、\“\”\‘\']+$/ //昵称,只能是中文/数字/英文字母 以及特殊符号
const accountReg = /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{5,20}$/ //账号,5-20位英文数字组合
const emailReg = /^([a-zA-Z0-9_])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/ //邮箱
function getRandColor () {
  var tem = Math.round(Math.random() * colorListLength)
  return colorList[tem]
}

export { mobileReg, passwordReg, chineseReg, digitalReg, hostReg, nickReg, accountReg, emailReg ,getRandColor }

调用~~.vue

 import { mobileReg } from "@/utils/global";

 if (!mobileReg.test(this.form.mobile)) {

     this.$toast("请输入正确的手机号");

     return false;

  }

2、全局变量模块挂载到Vue.prototype里。(调用不需要导入,要用this)

 

main.js

import {loginBaseURL} from './utils/config'

Vue.prototype.$baseImageUrl = baseImageUrl

Vue.prototype.$appName = 'My App'


---.vue
this.$baseImageUrl.value

this.$appName

可读改的

1:在main.js的data中设置

main.js定义

new Vue({
    router,
    data: function(){
        return {
            ORDERID: 'PLDxxxxxx0001',
        }
    },
    render: h => h(App)
}).$mount('#app');



某个vue页面

// 修改
this.$root.ORDERID = "xxxxx"
// 引用
let orderId = this.$root.ORDERID 

2:Cookie的使用(js-cookie插件)

一、安装
npm install js-cookie --save

二、引用
import Cookies from 'js-cookie'

三、一般使用
存到Cookie去
1.Cookies.set('name', 'value');  
Cookies.set('name', 'value', { expires: 7 });  
Cookies.set('name', 'value', { expires: 7, path: '' });  

2.在Cookie中取出
Cookies.get('name'); 

3.删除
Cookies.remove('name');  
   

3:vuex(状态管理模式,data共享)

                                         -------------------------------------------------------》看下篇

 

 

 

Logo

前往低代码交流专区

更多推荐