在Vuex教程中有這樣一段
Action
Action 類似于 mutation亿柑，不同在于：
- Action 提交的是 mutation厦取，而不是直接變更狀態(tài)纤怒。
- Action 可以包含任意異步操作闽坡。
const store = new Vuex.Store({
state: {
count: 0
},
mutations: {
increment (state) {
state.count++
}
},
actions: {
increment (context) {
context.commit('increment')
}
}
})
在actions這段代碼下诱贿，穩(wěn)當(dāng)寫(xiě)到用es2015的結(jié)構(gòu)方法對(duì)代碼做了簡(jiǎn)化
actions: {
increment ({ commit }) {
commit('increment')
}
}
在vuex的api中action的部分有這樣一句話“處理函數(shù)總是接受 context 作為第一個(gè)參數(shù)，payload 作為第二個(gè)參數(shù)（可選）”罐栈。
image.png你可以理解為action中的函數(shù)會(huì)默認(rèn)自動(dòng)獲取context這個(gè)對(duì)象為第一個(gè)參數(shù)黍衙。
而context這個(gè)對(duì)象擁有和store相同的屬性和方法，從圖中可以看到荠诬。
所以這段解構(gòu)實(shí)際上是這樣的
{commit} = context //context是自動(dòng)獲取的對(duì)象
上面這段代碼怎么理解的琅翻，可以去看下es2015對(duì)象解構(gòu)賦值這一塊
對(duì)象的解構(gòu)賦值，可以很方便地將現(xiàn)有對(duì)象的方法柑贞，賦值到某個(gè)變量方椎。
// 例一
let { log, sin, cos } = Math;
// 例二
const { log } = console;
log('hello') // hello
上面代碼的例一將Math對(duì)象的對(duì)數(shù)、正弦钧嘶、余弦三個(gè)方法棠众，賦值到對(duì)應(yīng)的變量上，使用起來(lái)就會(huì)方便很多康辑。例二將console.log賦值到log變量摄欲。
這樣一來(lái)就很好理解了，因?yàn)閏ontext對(duì)象中有commit方法疮薇，所以直接解構(gòu)了
本篇文章是個(gè)人理解胸墙，如果有錯(cuò)誤希望能告知
