Mutate vuex store property from modules

Question

Is it possible to mutate a vuex store property from a module?

My case is this:

I have an array property, arr[], in my main Vuex store (index.js).

The store is quite large so I'm trying to make it more modular by setting up individual modules for various actions and mutations.

Multiple modules all need to be able to mutate the array so I can’t place the array in an individual module.

I am having trouble figuring out how to access the array in index.js from one or many modules.

I have tried using rootState in my module actions but I can’t get it to work whilst also passing args related to the function.

I have also looked into getters but I don’t have a good enough understanding of them to know if this is the right way to go.

Is it possible to somehow access the array and mutate it from a module?

Answer 1

A better approach would be to have a single mutate function in your primary moudle (which containes the array) along with an action which is called to commit the mutation. Then, you can call this action from any other module you wish to using

dispatch(your_base_action, {args}, { root: true })

To access your array from any other module, you can use rootState, like so-

rootState.base_arr