【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

        }

}