1、建立一个globle.js
export default {
FLAG1:1,
FLAG2:2,
setF1(flag1) {
this.FLAG1 = flag1;
},
setF2(flag2) {
this.FLAG2 = flag2;
}
}
2、在vue项目的main.js中导入globle.js文件,
import globle from "../src/components/globle.js"
并将对象添加到vue原型链上,这样就可以在组件中直接调用了
Vue.prototype.$globle=globle;
3、在组件中拿到全局变量值并修改全局变量
<el-button style="float: left" type="primary" @click="show2">全局变量值+1</el-button>
show2 () {
console.log("全局变量1的值:" + this.$globle.FLAG1);
let flag = this.$globle.FLAG1 + 1;
this.$globle.setF1(flag);
console.log("全局变量1递增后的值:" + this.$globle.FLAG1);
},