dispatch js实现_详解vuex中action何时完成以及如何正确调用dispatch的思考
在项目中遇到关于action与dispatch使用的一些细节问题,经过搜索得到了一些答案。
特意在此提出,如有错误还请指出,十分感谢~
问题1:如果action是异步的,那么怎么知道它什么时候完成?在vuex的官网给出了答案:
注:如果需要通过组合多个action来完成某些逻辑,用async/await会更简单一点
问题2: 如果action是同步的,就不需要等待它完成了吗?
其实这个问题相当于在w:dispatch('some action')是一个同步函数还是异步函数。
如果dispatch是一个异步函数(返回一个promise),那么即使action里面的逻辑是同步的,如果需要等待这个action完成之后才进行某些操作,仍然是需要用异步等待dispatch().then(()=> {})来实现
通过查看vuex的源码找到了答案:
dispatch (_type, _payload) {
// check object-style dispatch
const {
type,
payload
} = unifyObjectStyle(_type, _payload)
const action = { type, payload }
const entry = this._actions[type]
if (!entry) {
if (process.env.NODE_ENV !== 'production') {
console.error(`[vuex] unknown action type: ${type}`)
}
return
}
try {
this._actionSubscribers
.filter(sub => sub.before)
.forEach(sub => sub.before(action, this.state))
} catch (e) {
if (process.env.NODE_ENV !== 'production') {
console.warn(`[vuex] error in before action subscribers: `)
console.error(e)
}
}
const result = entry.length > 1
? Promise.all(entry.map(handler => handler(payload)))
: entry[0](payload)
return result.then(res => {
try {
this._actionSubscribers
.filter(sub => sub.after)
.forEach(sub => sub.after(action, this.state))
} catch (e) {
if (process.env.NODE_ENV !== 'production') {
console.warn(`[vuex] error in after action subscribers: `)
console.error(e)
}
}
return res
})
}
dispatch函数返回的是一个promise,所以dispatch后如果需要跟进操作(比如dispatch里面commit了一个state,后续要用到这个state),正确的做法应该是需要用异步的方式来完成后续的逻辑
注:用同步的写法看起来好像state也是对的,但可能只是恰好我的业务场景io使用不是很高所以"看起来是对的",严谨的做法应该还是需要用异步来完成后续操作的
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
dispatch js实现_详解vuex中action何时完成以及如何正确调用dispatch的思考相关推荐
- vue 组件属性监听_详解vuex 中的 state 在组件中如何监听
前言 不知道大家有没有遇到过这样一种情况? vuex中的state会在某一个组建中使用,而这个状态的初始化是通过异步加载完成的.组件在渲染过程中,获取的state状态为空.也就是说组件在异步完成之前就 ...
- python中heapq的库是什么_详解Python中heapq模块的用法
详解Python中heapq模块的用法 来源:中文源码网 浏览: 次 日期:2018年9月2日 [下载文档: 详解Python中heapq模块的用法.txt ] (友情提示:右键点上行t ...
- python中get函数是什么意思_详解python中get函数的用法(附代码)_后端开发
strncmp函数用法详解_后端开发 strncmp函数为字符串比较函数,其函数语法为"int strncmp ( const char * str1, const char * str2, ...
- python中break怎么用_详解Python中break语句的用法
详解Python中break语句的用法 在Python中的break语句终止当前循环,继续执行下一个语句,就像C语言中的break一样. break最常见的用途是当一些外部条件被触发,需要从一个循环中 ...
- python操作目录_详解python中的文件与目录操作
详解python中的文件与目录操作 一 获得当前路径 1.代码1 >>>import os >>>print('Current directory is ',os. ...
- python3中unicode怎么写_详解python3中ascii与Unicode使用
这篇文章主要为大家详解python3中ascii与Unicode使用的相关资料,需要的朋友可以参考下# Auther: Aaron Fan ''' ASCII:不支持中文,1个英文占1个字节 Unic ...
- python中list[1啥意思_详解Python中list[::-1]的几种用法
本文主要介绍了Python中list[::-1]的几种用法,分享给大家,具体如下: s = "abcde" list的[]中有三个参数,用冒号分割 list[param1:para ...
- java 死锁 内存消耗_详解Java中synchronized关键字的死锁和内存占用问题
先看一段synchronized 的详解: synchronized 是 java语言的关键字,当它用来修饰一个方法或者一个代码块的时候,能够保证在同一时刻最多只有一个线程执行该段代码. 一.当两个并 ...
- pythonnamedtuple定义类型_详解Python中namedtuple的使用
namedtuple是Python中存储数据类型,比较常见的数据类型还有有list和tuple数据类型.相比于list,tuple中的元素不可修改,在映射中可以当键使用. namedtuple: na ...
最新文章
- 聊一聊:Service层你觉得有用吗?
- mnn linux编译
- android post请求添加公共参数_Java实现通用的Get和Post请求组件
- Ubuntu用户设置文件说明
- 历届试题 错误票据(multiset)
- mysql007.算数运算.别名.去重.排序
- 工作342:消除平时环境的console
- 迷你世界远古机器人_以我的世界生物为原型 打造17款创意庇护所
- odoo10参考系列--操作(Actions)
- 【报告分享】2020中国消费品牌发展报告.pdf(附下载链接)
- 区块链扫盲 | 认知升级,虚拟货币骗子是什么样子的?
- 网页点击链接,跳转qq添加好友
- Excel文本取首字母(包括繁体)VBA开发工具
- Flutter 接入iOS苹果内购支付踩坑过程
- altium designer 入门视频教程 制作pcb教程视频
- 什么是内部类,以及内部类的特点
- GDUFS 2018信息学院程序设计新手赛(正式赛)Java版题解
- 如何一键处理掉Excel表格中的地域词?
- 谷歌PR值停止更新的影响
- UVA 662 Fast Food(dp)