Vue全局变量的定义及使用方法
作者：蓝胖子的多啦A梦
这篇文章主要给大家介绍了关于Vue全局变量的定义及使用的相关资料,定义完全局变量后,我们可以在程序中的任何地方使用它们,文中通过代码介绍的非常详细,需要的朋友可以参考下
首先 声明Vue 使用全局变量的方法有很多，以下只是个人觉得比较简洁的2种。
其中两者的第一步操作相同，即：
创建全局变量文件Global.vue，内容如下：
<script>
const name = 'ZhangSan'; //名称
const address = 'No.20, Taihu Road'; //地址
export default {
name,
address
}
</script>方法1：在main.js中直接将全局变量挂载到Vue.prototype
import global from '../components/xx/Global' Vue.prototype.GLOBAL = global;
用时不用任何多余操作，直接调用 this.GLOBAL.name 即可。
方法2：在需要使用全局变量的页面引入global再使用
import global from '../components/xx/Global'
data() {
return {
userName: global.name,
userAddress: global.address
}
}二 第一步：单独新建一个全局变量模块文件，模块中定义一些变量初始状态，用export default 暴露出去。
// 判断是否显示logoconst logo = true;export default {<!-- --> logo};
第二步：在main.js中引入，并通过Vue.prototype挂载到vue实例上面。供其他模块文件使用；
// 判断是否显示logo
const logo = true;
export default {
logo
};第三步：在需要的模块文件中引入并使用；
页面使用
总结
到此这篇关于Vue全局变量的定义及使用的文章就介绍到这了,更多相关Vue全局变量使用内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！