如何从另一个vuex模块访问getter?

时间:2017-09-01 11:47:06

标签: javascript vue.js vuejs2 vuex

在vuex getter中我知道可以从另一个vuex模块访问状态,如下所示:

pages: (state, getters, rootState) => {
    console.log(rootState);
}

如何从其他vuex模块而不是状态访问getter?

我有另一个名为过滤器的vuex模块,我需要访问,我试过这个:

rootState.filters.activeFilters

activeFilters是我的吸气剂,但这不起作用。使用rootState.filters.getters.activeFilters也不起作用。

2 个答案:

答案 0 :(得分:58)

不得不仔细阅读文档,但我找到了它:

https://vuex.vuejs.org/en/api.html

(Ctrl + F在该页面上搜索RootGetters)

我的代码变为:

pages: (state, getters, rootState, rootGetters) => {}

请注意,所有rootGetter都是全局的,并且您不再像rootState那样使用它,您可以使用模块名称为状态添加前缀。

你只需从另一个模块调用一个getter:

rootGetters.activeFilters

希望这将有助于未来遇到这种情况的人。

答案 1 :(得分:4)

如果您要从模块访问全局/命名空间的getter,请按照以下步骤操作

getters: {
    // `getters` is localized to this module's getters
    // you can use rootGetters via 4th argument of getters
    someGetter (state, getters, rootState, rootGetters) {
        rootGetters.someOtherGetter //'someOtherGetter' global getter
        rootGetters['bar/someOtherGetter'] //'bar/someOtherGetter' namespaced getter
    },
    ...
},

这里是访问actions的方式,还包括使用actionmutations作为参考。

actions: {
      // dispatch and commit are also localized for this module
      // they will accept `root` option for the root dispatch/commit
      someAction ({ dispatch, commit, getters, rootGetters }) {
      
        rootGetters.someGetter //'someGetter' global getter
        rootGetters['bar/someGetter'] //'bar/someGetter' namespaced getter

        dispatch('someOtherAction') //'someOtherAction' local action
        dispatch('someOtherAction', null, { root: true }) //'someOtherAction' namespaced action

        commit('someMutation') //'someMutation' local mutation
        commit('someMutation', null, { root: true }) //'someMutation' namespaced mutation
      },
      ...
    }
  }