异步处理需要在 仓库的actions中定义
Action 类似于 mutation,不同在于:
· Action 提交的是 mutation,而不是直接变更状态。
· Action 可以包含任意异步操作。
我们可以在action中发送异步请求,成功后触发mutation 将结果传入,在mutation赋值给state
const store = new Vuex.Store({
state: {
items: [] // 定义一个公共的购物车数据
},
mutations: {
// 定义mutation来修改state
INIT_ITEMS(state, items){
state.items = items
}
},
actions: {
// action可以发送异步请求,得到数据后commit mutation将请求结果传入
FETCH_ITEMS({commit}, params = {}){
// 调用封装好的 接口函数
fetchItem(params).then(res => {
if(res.data.code === 200) {
commit('INIT_ITEMS', res.data.data)
}
})
}
}
})