Vue.js Vuex 无法访问路由器中的存储答案

【问题标题】：Vue.js Vuex cannot access store in routerVue.js Vuex 无法访问路由器中的存储
【发布时间】：2020-12-28 03:36:50
【问题描述】：

我已经看到这个问题已经被问过几次了，但我找不到任何好的答案，也不明白为什么我的代码会这样。

正如标题中所说，我正在尝试将我的商店导入路由器中，以便能够有条件地使用我的 getter，并授予用户访问或不访问路由的权限。

但是，当我尝试导入商店时，我收到以下错误：

[vuex] unknown action type: autoSignIn

这是来自：

const vm = new Vue({
router,
store,
provide,
i18n,
render: handle => handle(App),
created () {

firebase.auth().onAuthStateChanged((user) => {
  if (user) {
    this.$store.dispatch('autoSignIn', user)
    this.$store.dispatch('loadMatter')
    this.$store.dispatch('loadFootprints')
    this.$store.dispatch('loadMembers')
  }
})

所以我猜当我的应用程序启动时，商店还没有加载。

如何解决我希望能够使用的问题

store.getters.mygetter

非常感谢

【问题讨论】：

标签： vue.js vuex vue-router

【解决方案1】：

我认为您需要将商店导入您的路由器文件

我是这样做的：

import store from "@/store/index.js";

【讨论】：

感谢您的回答，我已经在导入返回此错误的商店

【解决方案2】：

在我的路由器文件中导入商店时，我收到以下错误

[vuex] unknown action type: autoSignIn

我尝试了另一个线程中的另一个解释，但它似乎也不起作用

router.app.$store.getters.mygetters

但是当我 console.log 时它返回 undefined

感谢您的帮助

【讨论】：

【解决方案3】：

你在使用 vuex 的模块吗？你能分享你的商店索引文件吗？

https://vuex.vuejs.org/guide/modules.html

如果你使用的是 vuex 的模块，你应该这样做。$store.dispatch('module_name/action_name')

【讨论】：

当我尝试这样做时，我得到 store is undefined.$store.dispatch('module_name/action_name')
你能创建一个 git repo 吗？所以我可以重现你的错误。

【解决方案4】：

我将商店拆分为文件

Vue.use(Vuex);

const store = new Vuex.Store({
  state,
  actions,
  mutations,
  getters,
  plugins: [
    process.env.NODE_ENV === 'development' && createLogger({ collapsed: false }),
  ].filter(Boolean),
});

export default store;

【讨论】：