Vue.prototype 全局变量

有两种都是在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.$a从Vue.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

巴特西