在独立JS模块中调用Vue.$store报undefined?

梁同学de自言自语
  • 436
  • main.js
import Vue from 'vue'
import Vuex from 'vuex'

//实例化Vuex
const store = new Vuex.Store({
  state: {
    count: 0,
  },
  mutations: {
      countAdd: function (state) {
        state.count++;
      }
  }
});

//实例化Vue
new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app-box')
  • 写调用后台接口的services.js
import Vue from 'vue'

let appStore = Vue.$store       //这里提示Vue.$store 为undefined
let wx = Vue.$wechat    //但是vux的wechat不是undefined
评论
阅读 10.3k
3 个回答
import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)
Vue.$store // 这里当然是 undefined ,Vue 实例上才会注入 $store

运用逆向思维
独立模块,封装的方法里面加一个vue实例的参数,在组件里调用的时候把this传进去就可以访问到store了

搜索到这里,我回答一下:
我的 store/index.js 中将 store 载在 Vue

import Vue from 'vue'
import Vuex from 'vuex'

import survey from './modules/survey'
import user from './modules/user'
import env from './modules/env'

Vue.use(Vuex)

const store = new Vuex.Store({
  modules: {
    survey, user, env
  }
})
export default store

如果在某一个 .js 文件中想要使用只要将该文件 import 即可。例如:

import store from '../store'

// 如果是
const isWeixin = store.getters.isWeixin
撰写回答

登录后参与交流、获取后续更新提醒

宣传栏