vuex.esm.js?2f62:1023 [vuex] unknown getter: doneTodos

代码如下所示怎么修改?
login.vue


  
主要按钮
{{ doneTodos }}
import Vue from "vue"; import { mapGetters, mapActions } from "vuex"; export default Vue.extend({ created() { console.log("111111", this.$store.state.mainStore.test); }, computed: { ccc() { return "nnnn"; }, ...mapGetters(["doneTodos"]), }, });

image.png
main.ts中内容

const mainStore = {
    namespaced: true,
    state: {
        test: "aaa",
    },
    getters: {
        doneTodos: (state: any) => {
            return state.test.length;
        }
    }
}
export default mainStore;
import Vue from "vue";
import Vuex from "vuex";
import mainStore from './modules/main';

Vue.use(Vuex);



export default new Vuex.Store({
  // state: {},
  // mutations: {},
  // actions: {},
  modules: {
    mainStore,
  }
});

最佳答案

Vuex 中的 state 和 Vue 中的 data 遵循相同规则,data 必须声明为返回一个初始数据对象的函数。

因为使用了 modules, 所以 store 中的 state 写法有问题,导致 getter 中没有导出 test,改成以下试试:

const mainStore = {
    namespaced: true,
    state: () => ({
        test: "aaa",
    })
    ...
}