We can start with a simple store by using CDN or direct download with the following steps:
- Install Vue and Vuex with the HTML <script> blocks:
<script src="/path/to/vue.js"></script>
<script src="/path/to/vuex.js"></script>
- Activate the Vuex store in the HTML <body> block:
<script type="text/javascript">
const store = new Vuex.Store({
state: { count: 0 },
mutations: {
increment (state) { state.count++ }
}
})
store.commit('increment')
console.log(store.state.count) // -> 1
</script>
You can see from this code that you just need to create the Vuex state in a JavaScript object, a mutation method, and then you can access the state object with the store's state key and trigger the change in the state with the store's commit method, as follows:
store.commit('increment')
console.log(store.state.count)
In this simple example, we have...