vue定义全局变量的几种方式

1.定义专用模块来配置全局变量

定义一个专用模块来配置全局变量,然后通过export暴露出去,在需要的组件引入
global.vue

const a=1;
export default{
    a
}

引入

import global from './global'

2.通过全局变量挂载到Vue.prototype

main.js

Vue.prototype.a = 1;

组件调用

console.log(this.a)

3.使用window对象

window.a=1

4.使用vuex

安装:

npm install vuex --save

新建store.js文件

import Vue from 'vue'
import Vuex from 'vuex';
Vue.use(Vuex);

export default new Vuex.Store({
  state:{
    a:1
  }
})

main.js中引入

import store from './store'
new Vue({
  el: '#app',
  router,
  store,
  components: { App },
  template: '<App/>'
});

组件内调用

console.log(this.$store.state.a)

发表评论

您的电子邮箱地址不会被公开。