vuex中commit和dispatch

Posted 2023-02-16

参考技术A 当我们创建一个 vuex 时候，也就是创建一个 store 实例。我们使用 vuex 其实也就是对 store 实例的使用

当我们使用 mutations 时，其实也就是在 store 实例上注册一个 mutation 。因为 mutation 处理函数总是接受 state 作为第一个参数（如果定义在模块中，则为模块的局部状态），第二个参数可选。这也就是为什么我们可以 store.commit('func') 来调用相对应的 mutation 。

当我们使用 actions 时，其实也是在 store 上注册 action 。处理函数总是接受 context 作为第一个参数。关于 context 其实是个对象，包含以下属性：

这也是为什么我们可以使用 store.dispatch('increment') 来分发action。

当我们使用 store.dispatch('increment') 时，会在当前store实例上的 _actionSubscribers 数组中根据传入的 type 来遍历查找相对应的action来触发相对应的 mutation 。

而我们通过 commit 来遍历 _mutations 处理相对应的 mutation handler 。