首页 / VUE / Vue.prototype 全局变量

Vue.prototype 全局变量

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了Vue.prototype 全局变量，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含820字，纯文字阅读大概需要2分钟。

内容图文

有两种都是在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

原文：https://www.cnblogs.com/cxscode/p/11188143.html

内容总结

以上是互联网集市为您收集整理的Vue.prototype 全局变量全部内容，希望文章能够帮你解决Vue.prototype 全局变量所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

扫描二维码推送至手机访问。

本文链接：https://qyyshop.com/info/1086751.html

来源：【匿名】