VUE 全局变量的几种实现方式

一、全局变量专用模块
意思是说，用一个模块（js or vue）管理这套全局变量，模块里的变量用export （最好导出的格式为对象，方便在其余地方调用）暴露出去，当其它地方须要使用时，用import 导入该模块
二、全局变量模块挂载到Vue.prototype 里
Global.js同上，在程序入口的main.js里加下面代码

import global_ from './components/tool/Global'
Vue.prototype.GLOBAL = global_
挂载以后，在须要引用全局量的模块处，不需再导入全局量模块，直接用this就能够引用了，以下:

<script type="text/javascript">
export default {
data () {

return {
  getColor: this.GLOBAL.getRandColor,
  mainList: [
    {
      id: 1,
      img: require('../../assets/rankIcon.png'),
      title: '登陆界面'
    },
    {
      id: 2,
      img: require('../../assets/rankIndex.png'),
      title: '主页'
    }
  ]
}

}
}
</script>
1和2的区别在于：2不用在用到的时候必须按需导入全局模块文件
三、vuex
//摘自网络