首页 > 解决方案 > 商店无法识别我的模块并且没有显示错误

问题描述

我的 VueJS 应用程序中有一个 store.js 文件,但它有点太大了,所以尝试为它创建一些模块。但是我不确定我做错了什么,因为我的一个模块文件正常工作,而另一个没有做任何事情并且没有显示错误,我的组件根本没有出现。

我所有的模块文件如下:

const myModule= {
  state: {
    myState: false
  },
  mutations: {
    myMutation (state){
      return state.myState= true;
    }
  },
  actions: {
    myAction({ commit }) {
      // what i need to be done
    }
  },
  getters: {
    myState( state ) {
      return state.myState;
    }    
    }
  }

  export default myModule;

我将它们导入到我的 store.js 文件中,如下所示:

import myModule from '@/modules/myModule'

const store = new Vuex.Store({
  namespaced: true,
  modules: {
    loginModule
  },

我已经尝试使用他们的状态和动作如下

this.$store.dispatch('myAction').myModule
this.$store.getters['myModule/myState']

然而,只有我创建的第一个模块文件可以工作,而其他的没有,而且它们都具有相同的结构并且没有显示错误。不知道这里有什么问题。

编辑:显然这些行动是有效的,但不是我的吸气剂。

标签: modulevuexstore

解决方案


据我所知,您不需要对商店进行命名空间。

https://vuex.vuejs.org/guide/modules.html#accessing-global-assets-in-namespaced-modules

您最喜欢将模块命名为命名空间。

然后您可以使用 mapGetters、mapState、mapMutations、mapActions 轻松访问您的属性


推荐阅读