最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
在Vuex使用dispatch和commit来调用mutations的区别详解
时间：2022-06-25 15:38:09 编辑：袖梨 来源：一聚教程网
main.js中
import Vuex from 'vuex'
Vue.use(vuex);
const store = new Vuex.store({
state: {
nickName: "",
cartCount: 0
},
mutations: {
updateUserInfo(state,nickName) {
state.nickName = nickName;
},
updateCartCount(state,cartCount) {
state.cartCount += cartCount;
}
},
actions: {
updateUserInfo(context) {
context.commit("updateUserInfo");
},
updateCartCount(context) {
context.commit("updateCartCount");
}
}
})
new Vue({
el: "#app",
store,
router,
template: '
组件中：
methods: {
increment(){
this.$store.dispatch("updateUserInfo", 'nick'); //this.$store.commit("increment", 'nick');
},
decrement() {
this.$store.dispatch("updateCartCount", 1); // this.$store.commit("decrement", 1);
}
}
区别：
dispatch：含有异步操作，例如向后台提交数据，写法： this.$store.dispatch('mutations方法名',值)
commit：同步操作，写法：this.$store.commit('mutations方法名',值)
相关文章
- Yandex网页版访问入口 Yandex搜索引擎官网登录 10-26
- AI漫剧伪装直男1‑24集无雾版夸克网盘资源免费分享 10-26
- 韩漫在线免费漫画入口-最新韩漫免费阅读入口 10-26
- 海角社区最新登录入口-2026海角官网在线登录直达地址 10-26
- mcjs网页版即点即玩-mcjs极速秒玩入口 10-23
- 超星学习通网页版登录-超星学习通官网入口 10-23