Vuex是一个专门为Vue.js应用程序开发的状态管理模式
使用方法：
-
使用vuex插件
import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) -
创建一个Store实例
const store = new Vues.State({ state: { //状态，类似于vue的data，但是数据不能修改 }, mutations:{ //类似于事件，同步事件 }, actions:{ //异步操作，之后 } })
-
vuex的一些规则：
提交mutations是更改状态的唯一方法，并且这个过程是同步的
mutation 必须是同步函数
异步逻辑都应该封装在actions里面，但是actions不能直接更改state里面的数据，只能通过mutations里面的方法来修改state里面的数据
Vuex中的store是响应式的，当状态发生变化时，监视状态的Vue组件也会自动更新
-
当需要在对象上添加新的属性时，应该使用Vue.set
Vue.set(obj,'newProp','123')
-
在mutations中如何获取state中的数据？
mutations非常类似于事件：每个 mutation 都有一个字符串的 事件类型 (type) 和 一个 回调函数 (handler)
我们可以在回调函数中进行对state中数据修改的操作，接收state作为第一个参数，其余参数可从第二个参数开始
-
用state.XXX来访问state中的数据
const store = new Vuex.Store({ state:{ count:1 }, mutations:{ create(state, num){ state.count += num } } })
-
触发mutation中的方法？
mutations里面的 handler并不能直接被调用，这个选项更像是事件注册：当触发一个类型type为 XXX 的 mutation 时，调用此函数handler
-
要唤醒一个 mutation handler，需要以相应的 type 调用 store.commit 方法：commit
store.commit('create',100) //或者： store.commit({ type:'create', num:100 })
在Vue组件中如何获取Vuex状态？
-
在组件中提交mutations状态
//应该提前在组件中注入vuex，跟router是相似的 this.$store.commit('create',100) -
在actions中触发mutation中的方法
actions: { increment ({ commit }) { commit('create') } } -
分发 Action
Action 通过
store.dispatch方法触发：store.dispatch('increment') //在组件中分发action this.$store.dispatch('increment')
