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 相关文章推荐
srcElement表格样式
Sep 03 Javascript
下拉列表select 由左边框移动到右边示例
Dec 04 Javascript
js确认删除对话框适用于a标签及submit
Jul 10 Javascript
js监听鼠标事件控制textarea输入字符串的个数
Sep 29 Javascript
基于jQuery实现拖拽图标到回收站并删除功能
Nov 25 Javascript
解决JS无法调用Controller问题的方法
Dec 31 Javascript
JS动态增删表格行的方法
Mar 03 Javascript
javascript面向对象程序设计高级特性经典教程(值得收藏)
May 19 Javascript
jQuery条件分页 代替离线查询(附代码)
Aug 17 jQuery
详解基于mpvue的小程序markdown适配解决方案
May 08 Javascript
layer.close()关闭进度条和Iframe窗的方法
Aug 17 Javascript
原生JS利用transform实现banner的无限滚动示例代码
Jun 15 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
10条PHP编程习惯助你找工作
2008/09/29 PHP
一个PHP的远程图片抓取函数分享
2013/09/25 PHP
php读取目录所有文件信息dir示例
2014/03/18 PHP
ThinkPHP模板中判断volist循环的最后一条记录的验证方法
2014/07/01 PHP
php中getservbyport与getservbyname函数用法实例
2014/11/18 PHP
在PHP站点的页面上添加Facebook评论插件的实例教程
2016/01/08 PHP
修改Laravel5.3中的路由文件与路径
2016/08/10 PHP
JavaScript阻止事件冒泡示例分享
2014/12/28 Javascript
jquery插件jquery.beforeafter.js实现左右拖拽分隔条对比图片的方法
2015/08/07 Javascript
Bootstrap~多级导航(级联导航)的实现效果【附代码】
2016/03/08 Javascript
Vue2.0点击切换类名改变样式的方法
2018/08/22 Javascript
微信小程序页面缩放式侧滑效果的实现代码
2018/11/15 Javascript
VUE中使用MUI方法
2019/02/12 Javascript
深入浅析vue中cross-env的使用
2019/09/12 Javascript
非常漂亮的js烟花效果
2020/03/10 Javascript
基于小程序请求接口wx.request封装的类axios请求
2020/07/02 Javascript
[04:13]2018国际邀请赛典藏宝瓶Ⅱ饰品一览
2018/07/21 DOTA
Python中的__SLOTS__属性使用示例
2015/02/18 Python
python中树与树的表示知识点总结
2019/09/14 Python
Python通用唯一标识符uuid模块使用案例
2020/09/10 Python
Python urlopen()参数代码示例解析
2020/12/10 Python
法国奢华女性时尚配饰网上商店:Monnier Frères
2016/08/27 全球购物
硕士研究生自我鉴定
2013/11/08 职场文书
大学生评语大全
2014/04/18 职场文书
机电一体化毕业生自荐信
2014/06/19 职场文书
工作总结与自我评价
2014/09/18 职场文书
2014年综治维稳工作总结
2014/11/17 职场文书
2014年保育员个人工作总结
2014/12/02 职场文书
新教师个人总结
2015/02/06 职场文书
戒赌保证书
2015/05/11 职场文书
保护环境建议书作文300字
2015/09/14 职场文书
聘任合同书
2015/09/21 职场文书
2017大学生寒假社会实践心得体会
2016/01/14 职场文书
《陶罐和铁罐》教学反思
2016/03/03 职场文书
Redis数据结构之链表与字典的使用
2021/05/11 Redis
《王国之心》迎来了发售的20周年, 野村哲发布贺图
2022/04/11 其他游戏