php js 全局变量定义,vue.js中如何定义全局变量

vue.js中定义全局变量的方法：1、在需要的地方引用进全局变量模块文件，并通过文件里面的变量名字获取全局变量参数值；2、在程序入口的【main.js】文件里面，将【Global.vue】文件挂载到【Vue.prototype】。

本教程操作环境：windows10系统、vue2.5.2，本文适用于所有品牌的电脑。

【相关文章推荐：vue.js】

vue.js中定义全局变量的方法：

原理:设置一个专用的的全局变量模块文件，模块里面定义一些变量初始状态，用 export default 暴露出去，在 main.js 里面使用 Vue.prototype 挂载到 vue 实例上面或者在其它地方需要使用时，引入该模块便可。

全局变量模块文件：

Global.vue 文件

const serverSrc='www.baidu.com';

const token='12345678';

const hasEnter=false;

const userSite="中国钓鱼岛";

export default

{

userSite,//用户地址

token,//用户token身份

serverSrc,//服务器地址

hasEnter,//用户登录状态

}

方法一:在需要的地方引用进全局变量模块文件，然后通过文件里面的变量名字获取全局变量参数值。

{{ token }}

import global_ from '../../components/Global'//引用模块进来

export default {

name: 'text',

data () {

return {

token:global_.token,//将全局变量赋值到data里面，也可以直接使用global_.token

}

}

}

方法二:在程序入口的 main.js 文件里面，将上面那个 Global.vue 文件挂载到 Vue.prototype。import global_ from './components/Global'//引用文件

Vue.prototype.GLOBAL = global_//挂载到Vue实例上面

接着在整个项目中不需要再通过引用 Global.vue 模块文件，直接通过 this 就可以直接访问 Global 文件里面定义的全局变量。text2.vue：

{{ token }}

export default {

name: 'text',

data () {

return {

token:this.GLOBAL.token,//直接通过this访问全局变量。

}

}

}

相关免费学习推荐：JavaScript(视频)