Vue x 模块命名空间

时间:2021-03-02 08:06:55

标签: vue.js vuex store

我遇到了一个我已经遇到的问题,该问题已通过命名空间解决,但没有任何帮助。 这是我的模块:

const Algo1Module = {
  namespaced: true,
  state: {
    questions: {
      question1: "test",
      question2: "",
      question3: "",
      question4: "",
      question5: "",
      question6: ""
    }
  },
  getters: {
    getMyQuestions(state) {
      return state.questions;
    }
  }
};

export default Algo1Module; // export the module

这是我商店中的 index.js:

import Vuex from "vuex";
import createLogger from "vuex/dist/logger";
import algo1 from "@/store/modules/algo1.store";

Vue.use(Vuex);
const debug = process.env.NODE_ENV !== "production";

export default new Vuex.Store({
  modules: {
    algo1
  },
  strict: debug,
  plugins: debug ? [createLogger()] : []
});

我尝试像这样从我的组件访问我的吸气剂:

<script>
import { mapGetters } from "vuex";
export default {
  name: "Algo",
  computed: {
    ...mapGetters("Algo1Module", ["getMyQuestions"])
  }
};
</script> 

但我在控制台中有一条错误消息:[vuex] 在 mapGetters() 中找不到模块命名空间:Algo1Module/

我不明白,或者我可能犯了一个错误。 谢谢你能给我的答案。

2 个答案:

答案 0 :(得分:2)

导入模块时会取你设置的名字,试试algo1

答案 1 :(得分:2)

  1. 您的模块名称已在 algo1 名称下注册。
  2. 如果您想称它为 Algo1Module,请像这样在商店中注册它:
modules: {
  Algo1Module: algo1,
}