在通过saveDisplayLimitQuanity如下所示的分派操作发布帖子后，我进行了变异以显示横幅，然后5秒钟后将其隐藏。
我将不得不将此逻辑添加到每个分派的动作中，因此会产生很多重复的代码。
saveDisplayLimitQuantity: (context, data) => {
return axios.post(data.url, {
display_limit: data.display_limit
})
.then(response => {
context.commit('setShowBanner', true);
context.commit('setBannerMessage', ['Display Limit Quantity Successully Updated!']);
context.commit('setBannerStatus', 'Success');
setTimeout(() => {
context.commit('setShowBanner', false);
context.commit('setBannerMessage', null);
context.commit('setBannerStatus', null);
}, 5000)
})
.catch(err => {
context.commit('setShowBanner', true);
context.commit('setBannerMessage', ['Something Went Wrong. Please try again']);
context.commit('setBannerStatus', 'Error');
setTimeout(() => {
context.commit('setShowBanner', false);
context.commit('setBannerMessage', null);
context.commit('setBannerStatus', null);
}, 5000)
})
},
我想做一个动作，可以放入返回的Promise中，每次都可以调用此消息，并且只是传递一条消息。我尝试通过添加dispatch作为参数来实现此目的，但仍然无法正常工作：
saveDisplayLimitQuantity: (context, data, dispatch) => {
return axios.post(data.url, {
display_limit: data.display_limit
})
.then(response => {
let data = {
'status': 'Success',
'message': "Yay!"
}
dispatch('showBanner',data)
})
.catch(err => {
let data = {
'status': 'Error',
'message': "Please try again"
}
dispatch('showBanner',data)
})
},
showBanner: (context,data) => {
context.commit('showBanner', true);
context.commit('bannerMessage', data.message);
context.commit('bannerStatus', data.status);
}
它不起作用，因为您无法showBanner正确访问该操作。在第一个示例中，您曾经context.commit()访问过mutation。因此，要访问，action您需要遵循相同的规则：
相反，传递的dispatch参数，你只需要调用action由它的context：
context.dispatch('showBanner', data);
甚至更好地argument destructuring在context对象上使用。它使您免于context一遍又一遍的呼叫：
saveDisplayLimitQuantity({ dispatch }, data) {
...
dispatch('showBanner', data);
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句