在项目中遇到关于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的思考相关推荐

  1. vue 组件属性监听_详解vuex 中的 state 在组件中如何监听

    前言 不知道大家有没有遇到过这样一种情况? vuex中的state会在某一个组建中使用,而这个状态的初始化是通过异步加载完成的.组件在渲染过程中,获取的state状态为空.也就是说组件在异步完成之前就 ...

  2. python中heapq的库是什么_详解Python中heapq模块的用法

    详解Python中heapq模块的用法 来源:中文源码网    浏览: 次    日期:2018年9月2日 [下载文档:  详解Python中heapq模块的用法.txt ] (友情提示:右键点上行t ...

  3. python中get函数是什么意思_详解python中get函数的用法(附代码)_后端开发

    strncmp函数用法详解_后端开发 strncmp函数为字符串比较函数,其函数语法为"int strncmp ( const char * str1, const char * str2, ...

  4. python中break怎么用_详解Python中break语句的用法

    详解Python中break语句的用法 在Python中的break语句终止当前循环,继续执行下一个语句,就像C语言中的break一样. break最常见的用途是当一些外部条件被触发,需要从一个循环中 ...

  5. python操作目录_详解python中的文件与目录操作

    详解python中的文件与目录操作 一 获得当前路径 1.代码1 >>>import os >>>print('Current directory is ',os. ...

  6. python3中unicode怎么写_详解python3中ascii与Unicode使用

    这篇文章主要为大家详解python3中ascii与Unicode使用的相关资料,需要的朋友可以参考下# Auther: Aaron Fan ''' ASCII:不支持中文,1个英文占1个字节 Unic ...

  7. python中list[1啥意思_详解Python中list[::-1]的几种用法

    本文主要介绍了Python中list[::-1]的几种用法,分享给大家,具体如下: s = "abcde" list的[]中有三个参数,用冒号分割 list[param1:para ...

  8. java 死锁 内存消耗_详解Java中synchronized关键字的死锁和内存占用问题

    先看一段synchronized 的详解: synchronized 是 java语言的关键字,当它用来修饰一个方法或者一个代码块的时候,能够保证在同一时刻最多只有一个线程执行该段代码. 一.当两个并 ...

  9. pythonnamedtuple定义类型_详解Python中namedtuple的使用

    namedtuple是Python中存储数据类型,比较常见的数据类型还有有list和tuple数据类型.相比于list,tuple中的元素不可修改,在映射中可以当键使用. namedtuple: na ...

最新文章

  1. 聊一聊:Service层你觉得有用吗?
  2. mnn linux编译
  3. android post请求添加公共参数_Java实现通用的Get和Post请求组件
  4. Ubuntu用户设置文件说明
  5. 历届试题 错误票据(multiset)
  6. mysql007.算数运算.别名.去重.排序
  7. 工作342:消除平时环境的console
  8. 迷你世界远古机器人_以我的世界生物为原型 打造17款创意庇护所
  9. odoo10参考系列--操作(Actions)
  10. 【报告分享】2020中国消费品牌发展报告.pdf(附下载链接)
  11. 区块链扫盲 | 认知升级,虚拟货币骗子是什么样子的?
  12. 网页点击链接,跳转qq添加好友
  13. Excel文本取首字母(包括繁体)VBA开发工具
  14. Flutter 接入iOS苹果内购支付踩坑过程
  15. altium designer 入门视频教程 制作pcb教程视频
  16. 什么是内部类,以及内部类的特点
  17. GDUFS 2018信息学院程序设计新手赛(正式赛)Java版题解
  18. 如何一键处理掉Excel表格中的地域词?
  19. 谷歌PR值停止更新的影响
  20. UVA 662 Fast Food(dp)

热门文章

  1. Luck Club-SDT 去中心化的游戏
  2. DotNetCore跨平台~dotnet pack打包详细介绍
  3. Mac下Android配置及unity3d的导出Android
  4. 接到面试通知你该做什么?
  5. eds800变频器故障代码_变频器常见故障代码及处理实例(经典,建议收藏)
  6. 这还是你所认知的Python吗?原来是这么牛!
  7. python正方形螺旋绘制_利用Python绘制一个正方形螺旋线
  8. php 添加行_php 多行数据同时插入
  9. oracle连接查询详解
  10. JavaScript初学者编程题(14)