typescript - 无法在 Vuex 和 vuex-module-decorators 中实现静态模块加载
我有一个简单的 Vue 应用,其根 Vuex store 中有一个 user 模块。我正在使用 vuex-module-decorators。我已经像 Vuex Nuxt 示例一样设置了 store/store-accessor.ts。它导入了所有模块的 ts 文件,并将 getModule(user) 的结果导出为 userStore。我没有任何 TypeScript 编译问题。
当我启动我的应用程序时,在 HelloWorld 组件中使用 userStore.user.uid,我得到:
TypeError: Cannot read property 'user' of undefined
at Object.get (index.js?6fc5:121)
at new HelloWorld (HelloWorld.vue?1d82:17)
at collectDataFromConstructor (vue-class-component.esm.js?2fe1:97)
at VueComponent.data (vue-class-component.esm.js?2fe1:172)
该堆栈跟踪在 vuex-module-decorators 的这段代码中结束。我用评论标记了错误位置:
function staticStateGenerator(module, modOpt, statics) {
var state = modOpt.stateFactory ? module.state() : module.state;
Object.keys(state).forEach(function (key) {
if (state.hasOwnProperty(key)) {
// If not undefined or function means it is a state value
if (['undefined', 'function'].indexOf(typeof state[key]) === -1) {
Object.defineProperty(statics, key, {
get: function () {
// ERROR HERE, modOpt.store.state has no property "user"
// modOpt.store looks like the root store, its state is empty.
// modOpt.name is "user", the name of my module.
return modOpt.store.state[modOpt.name][key];
}
});
}
}
});
我是否需要做些什么来将 modOpt.store.state["user"] 设置为 userStore 模块之类的东西?
我创建了一个 GitHub 仓库来展示这个问题:https://github.com/garyo/vuex-problem-test.git 只需克隆该仓库,yarn install 和 yarn serve,你就应该能在 JS 控制台看到错误。