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 动态添加事件代码
Nov 30 Javascript
JavaScript null和undefined区别分析
Oct 14 Javascript
js自执行函数的几种不同写法的比较
Aug 16 Javascript
让ie6也支持websocket采用flash封装实现
Feb 18 Javascript
jquery 获取 outerHtml 包含当前节点本身的代码
Oct 30 Javascript
AngularJS基础学习笔记之简单介绍
May 10 Javascript
vue.js学习之递归组件
Dec 13 Javascript
如何编写jquery插件
Mar 29 jQuery
Vue封装的可编辑表格插件方法
Aug 28 Javascript
微信小程序中上传图片并进行压缩的实现代码
Aug 28 Javascript
JS实现的合并两个有序链表算法示例
Feb 25 Javascript
微信小程序搭建自己的Https服务器
May 02 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
Yii中CGridView关联表搜索排序方法实例详解
2014/12/03 PHP
PHP 使用memcached简单示例分享
2015/03/05 PHP
举例讲解PHP面对对象编程的多态
2015/08/12 PHP
PHP自定义函数获取URL中一级域名的方法
2016/08/23 PHP
PHP解压ZIP文件到指定文件夹的方法
2016/11/17 PHP
一实用的实现table排序的Javascript类库
2007/09/12 Javascript
浅谈javascript中for in 和 for each in的区别
2015/04/23 Javascript
浅析Node.js的Stream模块中的Readable对象
2015/07/29 Javascript
jQuery的内容过滤选择器学习教程
2016/04/18 Javascript
浅谈JavaScript中的分支结构
2016/07/01 Javascript
JS实现显示带倒影的图片横排居中放大展示特效实例【测试可用】
2016/08/23 Javascript
vue打包相关细节整理(小结)
2018/09/28 Javascript
ES6小技巧之代替lodash
2019/06/07 Javascript
基于Electron实现桌面应用开发代码实例
2020/07/07 Javascript
微信小程序实现音乐播放页面布局
2020/12/11 Javascript
[01:57]DOTA2上海特锦赛小组赛解说单车采访花絮
2016/02/27 DOTA
[50:27]OG vs LGD 2018国际邀请赛淘汰赛BO3 第一场 8.26
2018/08/30 DOTA
python创建只读属性对象的方法(ReadOnlyObject)
2013/02/10 Python
详解tensorflow训练自己的数据集实现CNN图像分类
2018/02/07 Python
Selenium鼠标与键盘事件常用操作方法示例
2018/08/13 Python
python实战串口助手_解决8串口多个发送的问题
2019/06/12 Python
python3 下载网络图片代码实例
2019/08/27 Python
Django shell调试models输出的SQL语句方法
2019/08/29 Python
Django mysqlclient安装和使用详解
2020/09/17 Python
Python中logging日志的四个等级和使用
2020/11/17 Python
解决python的空格和tab混淆而报错的问题
2021/02/26 Python
利用python实现后端写网页(flask框架)
2021/02/28 Python
解决pytorch 保存模型遇到的问题
2021/03/03 Python
纯css3制作的火影忍者写轮眼开眼至轮回眼及进化过程实例
2014/11/11 HTML / CSS
Set里的元素是不能重复的,那么用什么方法来区分重复与否呢?
2016/08/18 面试题
2014年幼儿园植树节活动方案
2014/03/02 职场文书
优秀的个人求职信范文
2014/05/09 职场文书
派出所班子党的群众路线对照检查材料思想汇报
2014/10/01 职场文书
公务员政审个人总结
2015/02/12 职场文书
成绩单家长意见
2015/06/03 职场文书
教师病假条范文
2015/08/17 职场文书