我正在尝试切换到使用Vuex而不是我自己开发的商店对象,我必须说我没有像Vue.js世界其他地方那样清楚地找到文档 . 假设我有一个名为'products'的Vuex模块,它有自己的状态,突变,getter等 . 我如何在该模块中引用一个名为'clearWorking Data'的动作?文档提供了访问模块状态的示例:
store.state.a // -> moduleA's state
但是我无法看到关于吸气剂,突变,动作等的任何信息 .
在您的示例中,您可以将动作/突变视为某种方式的文件系统 store.dispatch('products/clearWorkingData') . 模块越深入嵌套在树中越深 .
store.dispatch('products/clearWorkingData')
所以你可以去 store.commit('first/second/third/method') 如果你有一个三层深的树 .
store.commit('first/second/third/method')
除了接受的答案,我想为你提供答案中缺少的吸气剂的工作范围 .
Debug the Store在任何情况下,您都可以调用 console.log(this.$store) 来调试商店 .如果这样做,您将看到getter在其名称中以名称空间为前缀 .
console.log(this.$store)
Access namespaced getterthis.$store.getters['yourModuleName/someGetterMethod']
this.$store.getters['yourModuleName/someGetterMethod']
Dispatch namespacedthis.$store.dispatch('yourModuleName/doSomething')
this.$store.dispatch('yourModuleName/doSomething')
Conclusion关键是处理命名空间就像Justin解释的文件系统一样 .
Edit: found a nice library for handling vuex Store除了基本知识之外,我还想添加这个vuex库作为vuex商店有效和快速工作的一个很好的补充 . https://github.com/davestewart/vuex-pathify .它看起来非常有趣并且非常关心您的配置,并且还允许您直接使用vuex处理2waybinding .
2 回答
在您的示例中,您可以将动作/突变视为某种方式的文件系统
store.dispatch('products/clearWorkingData')
. 模块越深入嵌套在树中越深 .所以你可以去
store.commit('first/second/third/method')
如果你有一个三层深的树 .除了接受的答案,我想为你提供答案中缺少的吸气剂的工作范围 .
Debug the Store
在任何情况下,您都可以调用
console.log(this.$store)
来调试商店 .如果这样做,您将看到getter在其名称中以名称空间为前缀 .
Access namespaced getter
this.$store.getters['yourModuleName/someGetterMethod']
Dispatch namespaced
this.$store.dispatch('yourModuleName/doSomething')
Conclusion
关键是处理命名空间就像Justin解释的文件系统一样 .
Edit: found a nice library for handling vuex Store
除了基本知识之外,我还想添加这个vuex库作为vuex商店有效和快速工作的一个很好的补充 . https://github.com/davestewart/vuex-pathify .
它看起来非常有趣并且非常关心您的配置,并且还允许您直接使用vuex处理2waybinding .