What is the Vuex "context" object?

Question

I am trying to get better understanding of what the "context" object is in Vuex.

The context object is referred to numerous times in the Vuex documentation. For example, in https://vuex.vuejs.org/en/actions.html, we have:

Action handlers receive a context object which exposes the same set of methods/properties on the store instance, so you can call context.commit to commit a mutation...

I understand how to use it, and also that we can use destructuring if we only want to use the "commit" from the context object, but was hoping for a little more depth, just so I can better understand what is going on.

As a start, I found a couple ~8.5 year old posts on the "context object" as a pattern: what is context object design pattern? and Can you explain the Context design pattern?

However, specifically to Vuex, I'd love a better understanding of:

1. What is the context object / what is its purpose?
2. What are all the properties/methods that it is making available to use in Vuex?

Thank you!

Answer 1

From the documentation you pointed out you can read:

We will see why this context object is not the store instance itself when we introduce Modules later.

The main idea of the context object is to abstract the scope of the current Module. If you simply access store.state, it will always be the root state.

The context object of actions and its properties/methods are described here in the source code and also referenced in the API documentation

Here is the list:

{   state,      // same as store.state, or local state if in modules   rootState,  // same as store.state, only in modules   commit,     // same as store.commit   dispatch,   // same as store.dispatch   getters,    // same as store.getters, or local getters if in modules   rootGetters // same as store.getters, only in modules }