What is Vuex in VUE JS?

In Vuex, actions are functions that call mutations . Actions exist because mutations must be synchronous, whereas actions can be asynchronous. You can define actions by passing a POJO as the actions property to the Vuex store constructor as shown below.

A payload is simply the data passed to our mutation from the component committing the mutation . How do we do that ? Simple… this.$store.commit(“SET_NAME”,your_name) This snippet of code will mutate the state and set whatever value that is assigned to your_name, to the name property inside our Vuex state.

Vuex gives us the ability to store and share reactive data across the app without trading off performance, testability or maintainability. It empowers Vue’s reactivity system and creates easily accessible data between independent components, without having to deal with complicated prop drilling.

A Vuex plugin is simply a function that receives the store as the only argument : const myPlugin = (store) => { // called when the store is initialized store. subscribe((mutation, state) => { // called after every mutation. // The mutation comes in the format of `{ type, payload }`. }) }8 Şub 2022

So after understanding the project, if a particular state is consumed by multiple components then and then you have to use Vuex.