vuex中store存储store.commit和store.dispatch的用法


Posted in Javascript onJuly 24, 2020

代码示例:

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);

两者都可以以载荷形式或者对象风格的方式进行提交

补充知识:如何获取vuex的action的返回值(axios请求为例)

因为之前老师有讲过将vuex的封装。

今天就想尝试写一下,然后就封装了。

但是我想要在vue组件里面获取vuex的action的返回值

这里我用的dispatch调用 如图

vuex中store存储store.commit和store.dispatch的用法

我这里使用的new Promise的方法

vuex中store存储store.commit和store.dispatch的用法

调用getlunbolist的时候返回一个new Promise,把需要的值用resolve带出

在组件就可以用then的方法取出来使用

vuex中store存储store.commit和store.dispatch的用法

我只是一个小小白,我知道我的表述很生硬而且可能还不准备,但是意思就是大概这个意思。而且会坚持把我觉得有收获的内容下来的,希望以后成大佬了能自己来完善,当然大佬们看到问题了可以多多指点一下小弟。

以上这篇vuex中store存储store.commit和store.dispatch的用法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript中跨域调用Flash的方法
Aug 11 Javascript
深入分析Cookie的安全性问题
Mar 01 Javascript
分享十五款 jQuery 社交网络分享插件
May 16 Javascript
在AngularJS中使用AJAX的方法
Jun 17 Javascript
AngularJS实现元素显示和隐藏的几个案例
Dec 09 Javascript
谈谈JavaScript类型系统之Math
Jan 06 Javascript
jqPlot jQuery绘图插件的使用
Jun 18 Javascript
JavaScript中${pageContext.request.contextPath}取值问题及解决方案
Dec 08 Javascript
JavaScript结合HTML DOM实现联动菜单
Apr 05 Javascript
使用Vue做一个简单的todo应用的三种方式的示例代码
Oct 20 Javascript
vue使用高德地图根据坐标定位点的实现代码
Aug 22 Javascript
测量JavaScript函数的性能各种方式对比
Apr 27 Javascript
js实现滑动滑块验证登录
Jul 24 #Javascript
解决VUEX的mapState/...mapState等取值问题
Jul 24 #Javascript
对vuex中store和$store的区别说明
Jul 24 #Javascript
小程序实现简单语音聊天的示例代码
Jul 24 #Javascript
浅谈Vuex的this.$store.commit和在Vue项目中引用公共方法
Jul 24 #Javascript
vue中全局路由守卫中替代this操作(this.$store/this.$vux)
Jul 24 #Javascript
javascript实现支付宝滑块验证码效果
Jul 24 #Javascript
You might like
人大复印资料处理程序_补充篇
2006/10/09 PHP
php中url函数介绍及使用示例
2014/02/13 PHP
浅析ThinkPHP缓存之快速缓存(F方法)和动态缓存(S方法)(日常整理)
2015/10/26 PHP
学习thinkphp5.0验证类使用方法
2017/11/16 PHP
锋利的jQuery 要点归纳(一) jQuery选择器
2010/03/21 Javascript
JavaScript 内置对象属性及方法集合
2010/07/04 Javascript
基于jquery完美拖拽,可返回拖动轨迹
2012/03/29 Javascript
jQuery实现密保互斥问题解决方案
2013/08/16 Javascript
非html5实现js版弹球游戏示例代码
2013/09/22 Javascript
jquery validation验证身份证号,护照,电话号码,email(实例代码)
2013/11/06 Javascript
js改变文章字体大小的实例代码
2013/11/27 Javascript
FF IE浏览器修改标签透明度的方法
2014/01/27 Javascript
jquery实现简单实用的弹出层效果代码
2015/10/15 Javascript
jqGrid用法汇总(全经典)
2016/06/28 Javascript
js设置和获取自定义属性的方法
2016/10/20 Javascript
JavaScript实现Fly Bird小游戏
2016/12/15 Javascript
jquery获取下拉框中的循环值
2017/02/08 Javascript
js 取消页面可以选中文字的功能方法
2018/01/02 Javascript
在Python中使用全局日志时需要注意的问题
2015/05/06 Python
python对数组进行反转的方法
2015/05/20 Python
Python实现识别手写数字大纲
2018/01/29 Python
在python中按照特定顺序访问字典的方法详解
2018/12/14 Python
Python3利用print输出带颜色的彩色字体示例代码
2019/04/08 Python
Django项目中使用JWT的实现代码
2019/11/04 Python
Django admin 实现search_fields精确查询实例
2020/03/30 Python
keras的load_model实现加载含有参数的自定义模型
2020/06/22 Python
澳大利亚领先的在线葡萄酒零售商:Get Wines Direct
2018/03/27 全球购物
Linux Interview Questions For software testers
2012/06/02 面试题
什么是SCM(软件配置管理)
2014/08/16 面试题
简历的自我评价
2014/02/03 职场文书
组织鉴定材料
2014/06/02 职场文书
党的群众路线教育实践活动总结大会主持词
2014/10/30 职场文书
2014会计年终工作总结
2014/12/20 职场文书
采购员工作总结范文
2015/08/12 职场文书
小学总务工作总结
2015/08/13 职场文书
js基础语法与maven项目配置教程案例
2021/07/15 Javascript