vuex中store.commit和store.dispatch的区别及使用方法

更新时间：2023年01月10日 10:12:49 作者：longzhoufeng

这篇文章主要介绍了vuex中store.commit和store.dispatch的区别及使用方法，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教

store.commit和store.dispatch的区别及使用

代码示例：

this.$store.commit('loginStatus', 1);

this.$store.dispatch('isLogin', true);

规范的使用方式

// 以载荷形式
store.commit('increment'，{
  amount: 10   //这是额外的参数
})

// 或者使用对象风格的提交方式
store.commit({
  type: 'increment',
  amount: 10   //这是额外的参数
})

主要区别

dispatch：含有异步操作，数据提交至 actions ，可用于向后台提交数据

this.$store.dispatch('isLogin', true);

commit：同步操作，数据提交至 mutations ，可用于读取用户信息写到缓存里

this.$store.commit('loginStatus', 1);

this.$store.dispatch() 与 this.$store.commit()

传值给vuex的mutation改变state

commit: 同步操作

存储

this.$store.commit('changeValue',name)

取值

this.$store.state.changeValue

dispatch: 异步操作

存储

this.$store.dispatch('getlists',name)

取值

this.$store.getters.getlists

总结

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

Vue3使用watch进行深度观察的操作方法
在 Vue 3 中,一个重要的特性是 watch 选项,它允许开发者对数据变化进行观察,本篇博客将详细介绍如何在 Vue 3 中使用 watch 进行深度观察,特别是在使用 setup 语法糖时,需要的朋友可以参考下
2024-11-11
vue实现图片加载完成前的loading组件方法
下面小编就为大家分享一篇vue实现图片加载完成前的loading组件，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2018-02-02
Vue中的v-for指令不起效果的解决方法
今天小编就为大家分享一篇Vue中的v-for指令不起效果的解决方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2018-09-09
如何巧用Vue.extend继承组件实现el-table双击可编辑(不使用v-if、v-else)
这篇文章主要给大家介绍了关于如何巧用Vue.extend继承组件实现el-table双击可编辑的相关资料,不使用v-if、v-else,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
2022-06-06
详解vue.js移动端导航navigationbar的封装
本篇文章主要介绍了vue.js移动端导航navigationbar的封装，具有一定的参考价值，有兴趣的可以了解一下
2017-07-07
vue鼠标悬停事件监听实现方法
页面在鼠标悬停(不动)n秒之后,页面进行相应的事件,下面这篇文章主要给大家介绍了关于vue鼠标悬停事件监听的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
2022-09-09
vue实现单点登录的方式汇总
最近项目停工了，RageFrame的学习暂时告一段落，这一篇给大家分享下有关单点登录的相关知识，并提供一些demo给大家参考，对vue单点登录的实现方式感兴趣的朋友一起看看吧
2021-11-11
详解vue中$router和$route的区别
这篇文章主要介绍了vue中$router和$route的区别，对vue感兴趣的同学，一定要看下
2021-05-05
一文带你完全掌握Vue自定义指令
作为使用Vue的开发者，我们对Vue指令一定不陌生，诸如v-model、v-on、等，同时Vue也为开发者提供了自定义指令的api，熟练的使用自定义指令可以极大的提高了我们编写代码的效率，让我们可以节省时间开心的摸鱼
2023-03-03
Vue移动端下拉加载更多数据onload实现方法浅析
这篇文章主要介绍了Vue移动端下拉加载更多数据onload实现方法，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
2023-02-02