Vuex State Management

Vuex State Management

- Vuex state is single state tree, that means you can have only one store per application.

- You can separate out multiple modules in once store and access them.

 

 

 

  1. Below is the structure of simple store:

export default new Vuex.Store({

state: {

a: 1

b: 2

},

actions: {

//....

},

mutations: {

//....

}

});

  1. You need to inject the store into your component, vuex has mechanism to inject store in all your sub components, Please check below example.

const app = new Vue({

el: '#app',

// provide the store using the "store" option.

store

});

  1. How to use store in your component, It's very simple to use store in your component, please check below example for more detail:

created() { //created event of your component

this.$store.state

}