动态注册的vuex模块的rootState不响应
我需要为从服务器检索的每个项目保留一些缓存的getter。我为每个项目动态注册一个vuex模块,如下所示:store.registerModule(['itemGet', id], {namespaced: true,state () { return {id} },getters: {exampleGetter (state, getters, rootSta...
·
我需要为从服务器检索的每个项目保留一些缓存的getter。
我为每个项目动态注册一个vuex模块,如下所示:
store.registerModule(['itemGet', id], {
namespaced: true,
state () { return {id} },
getters: {
exampleGetter (state, getters, rootState) {
if (rootState.oldModule.prop === 1) return state.id
return false
}
}
})
该模块已正确注册。
但是,每当我的这个动态模块的getter使用rootState并查看在商店实例化中注册的其他模块时,它都不rootState是被动的。
即使我做了一些突变的rootState(到另一个模块),在我的动态注册的模块干将使用rootState将始终保持rootState 只是在动态注册模块的时间 ...
在上面的例子中:
如果我store.state.oldModule.prop通过突变进行变异,exampleGetter则不会被动,只会rootState.oldModule.prop在动态模块注册时知道
问题解决方案:
问题不在于getter本身,而是创建了对getter的引用,但在模块注册期间意外地硬编码了结果:
我做了什么:
store.$itemGetters[id] = Object.keys(getters) // my getter functions
.reduce((carry, key) => {
carry[key] = store.getters[`itemGet/${id}/${key}`]
return carry
}, {})
我改变了什么来解决它:
store.$itemGetters[id] = Object.keys(getters)
.reduce((carry, key) => {
carry[key] = _ => { return store.getters[`itemGet/${id}/${key}`] }
return carry
}, {})
因此,不要使用以下内容调用特定项ID的getter:
store.$itemGetters[id].exampleGetter
我现在必须这样做:
store.$itemGetters[id].exampleGetter()
更多推荐



所有评论(0)