官方解释
dispatch(type: string, payload?: any, options?: Object): Promise<any>
dispatch(action: Object, options?: Object): Promise<any>
分发 action。options 里可以有 root: true，它允许在命名空间模块里分发根的 action。返回一个解析所有被触发的 action 处理器的 Promise
理解
this.$store.dispatch 分发 actions-> 调用 mutations->改变 states
思考
- Q1：为什么不直接分发 mutation
mutation 有必须同步执行的限制，而 Action 不受约束，可以在 action 内部执行异步操作
- Q2：Action 通常是异步的，如何知道 action 什么时候结束？如何才能组合多个 action，处理复杂的异步流程
store.dispatch 可以处理被触发的 action 的处理函数返回 Promise，并且 store.dispatch 仍旧返回 Promise
- 引用官网举例：
// 假设 getData() 和 getOtherData() 返回的是 Promise
actions: {
async actionA ({ commit }) {
commit('gotData', await getData())
},
async actionB ({ dispatch, commit }) {
await dispatch('actionA') // 等待 actionA 完成
commit('gotOtherData', await getOtherData())
}
}
一个 store.dispatch 在不同模块中可以触发多个 action 函数。在这种情况下，只有当所有触发函数完成后，返回的 Promise 才会执行
Vuex 中 dispatch()和 commit()的异同
- 相同点
都可以修改 state，并且也会触发视图的更新
- 不同点
commit 调用的是 vuex 中 mutation 里的方法，存在同步限制；而 dispatch 调用的数 vuex 中 action 里的方法，action 中可以调用 mutation 中的函数，也可执行异步操作
commit：同步操作
// 存储
this.$store.commit('chgval',name);
// 取值
this.$store.state.chgval;
dispatch：异步操作
// 存储
this.$store.dispatch('listdata',name);
// 取值
this.$store.getters.listdata;
