Search code examples
javascriptvue.jsvuejs2vuex

How to access the getter from another vuex module?


Within a vuex getter I know it is possible to access the state from another vuex module like so:

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

How can I access a getter from another vuex module instead of the state though?

I have another vuex module called filters that I need to access, I have tried this:

rootState.filters.activeFilters

Where activeFilters is my getter but this does not work. using rootState.filters.getters.activeFilters also does not work.


Solution

  • Had to dig through the documentation but I found it:

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

    (Ctrl+F search for RootGetters on that page)

    My code becomes:

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

    Beware that all rootGetters are global and you no longer use it like rootState where you would prefix the state by the module name.

    You simply call a getter from another module like so:

    rootGetters.activeFilters
    

    Hopefully this will help someone out in the future who is running into this as well.