vuex中mutation和action的詳細區別
const store = new Vuex.Store({
state: {
count: 0
},
mutations: {
increment (state) {
state.count++
}
},
actions: {
increment (context) {
context.commit('increment')
}
}
})
1、流程順序
“相應視圖—>修改State”拆分成兩部分，視圖觸發Action，Action再觸發Mutation。
2、角色定位
基於流程順序，二者扮演不同的角色。
Mutation：專注於修改State，理論上是修改State的唯一途徑。
Action：業務代碼、異步請求。
3、限制
角色不同，二者有不同的限制。
Mutation：必須同步執行。
Action：可以異步，但不能直接操作State。