当前位置 : 主页 > 大数据 > 区块链 >

Vue.prototype 全局变量

来源:互联网 收集:自由互联 发布时间:2021-06-22
有两种都是在main.js声明 第一种 main.js 声明 Vue.config.productionTip = false// mount axios Vue.$http and this.$httpVue.use(VueAxios) Vue.prototype.$a = 1 new Vue({ router,... 在组件中使用a console.log(this.$a) 这样定义有

有两种都是在main.js声明

第一种

main.js 声明

Vue.config.productionTip = false

// mount axios Vue.$http and this.$http
Vue.use(VueAxios)

Vue.prototype.$a = 1

new Vue({
  router,
...

在组件中使用a

console.log(this.$a)

 这样定义有一个问题,很容易和组件定义的值冲突,所有一般我习惯在值前面加$

 

这个值不是全局变量,而是原型,不支持修改

Vue.prototype不是全局变量,而是原型属性,去看看prototype和原型链的知识就明白了。

参考《JavaScript高级程序设计》第6章 面向对象的程序设计

因为每一次跳转到新的Vue页面,都是一个独立的Vue实例,实例中this.$aVue.prototype.$a而来,所以仍然是1


第二种

 有一种是在new Vue的时候声明,支持修改

new Vue({
    ...
    data() {
        return {
            ...,
            a: 1
            ...
        };
    },
    ...
});

其他所有组件中通过$root.a可访问和修改此变量。


第三种

把全局变量挂在Window下面,在main.js中:

window.a = 1;

 组件A

console.log(a)//1
a = 2;

 组件B

console.log(a)//2

 这种不到万不得已的情况尽量不要用,会对全局造成污染,出现问题也不好定位

 

参考:https://segmentfault.com/q/1010000009992656

 https://blog.csdn.net/pma934/article/details/86765722

上一篇:go tags
下一篇:RPC理解
网友评论