Vuex
Vuex的核心是store，store包含著state(狀態(tài))、getter(計算屬性)藕畔、mutation(事件)、action(異步操作)庄拇；
Vuex類似一個全局變量注服，但有兩個主要的區(qū)別：
- Vuex 的狀態(tài)存儲是響應(yīng)式的
- 不能直接改變 store 中的狀態(tài)韭邓，只能通過提交
mutation來改變
state
保存著應(yīng)用的狀態(tài)
getter
類似于 Vue 應(yīng)用中的 computed ，是從 store 中的 state 中派生出一些狀態(tài)
mutation
更改 Vuex 的 store 中的狀態(tài)的唯一方法
const store = new Vuex.Store({
state: {
count: 1
},
mutations: {
increment (state) {
// 變更狀態(tài)
state.count++
}
}
})
store.commit('increment')
action
與 mutation 類似溶弟，不同在于：
- action 提交的是 mutation女淑，而不是直接變更狀態(tài)
- action 可以包含異步操作
module
復(fù)雜的應(yīng)用需要區(qū)分不同的模塊
const moduleA = {
state: { ... },
mutations: { ... },
actions: { ... },
getters: { ... }
}
const moduleB = {
state: { ... },
mutations: { ... },
actions: { ... }
}
const store = new Vuex.Store({
modules: {
a: moduleA,
b: moduleB
}
})
store.state.a // -> moduleA 的狀態(tài)
store.state.b // -> moduleB 的狀態(tài)
