首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

我应该在分派时捕获Redux promise错误,还是只在reducer中处理它?

在分派时捕获Redux promise错误和只在reducer中处理错误是两种不同的处理方式,具体取决于你的需求和项目架构。

  1. 在分派时捕获Redux promise错误:
    • 概念:Redux promise是一种中间件,用于处理异步操作,它可以将异步操作的结果作为payload传递给reducer。
    • 分类:这种方式属于在action creator中处理错误。
    • 优势:可以在异步操作发生错误时立即捕获并处理,可以在action creator中进行错误处理逻辑,例如发送错误通知、重试等。
    • 应用场景:适用于需要在异步操作发生错误时立即做出响应的场景,例如需要及时通知用户或进行错误恢复的情况。
    • 推荐的腾讯云相关产品:无
  2. 只在reducer中处理Redux promise错误:
    • 概念:在reducer中处理Redux promise错误意味着将错误作为一种状态来处理,通过更新state来反映错误的发生。
    • 分类:这种方式属于在reducer中处理错误。
    • 优势:可以将错误作为状态进行管理,方便在UI中展示错误信息,也可以通过redux-devtools等工具进行错误追踪和调试。
    • 应用场景:适用于将错误作为状态进行管理,并在UI中展示错误信息的场景,例如需要在页面上展示错误提示或提供错误重试的情况。
    • 推荐的腾讯云相关产品:无

综上所述,选择在分派时捕获Redux promise错误还是只在reducer中处理错误,取决于你的具体需求和项目架构。如果需要在异步操作发生错误时立即捕获并处理,可以选择在分派时捕获错误;如果需要将错误作为状态进行管理,并在UI中展示错误信息,可以选择只在reducer中处理错误。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

Redux原理分析以及使用详解(TS && JS)

也正是由于这个机制,我们使用 middleware ,我们可以通过串联不同的 middleware 来满足日常的开发,每一个 middleware 都可以处理一个相对独立的业务需求且相互串联: 如上图所示...后面的中间件才有机会继续处理 action,同样的,每个中间件都有自己的“熔断”处理,当认为这个 action 不需要后面的中间件进行处理,后面的中间件也就不能再对这个 action 进行处理了。...换言之,中间件都是对store.dispatch()的增强 四、redux的异步流 多种中间件处理 redux 异步事件的中间件,绝对占有举足轻重的地位。...4.2、redux-promise 使用redux-promise中间件,允许action是一个promisepromise,如果要触发action,则通过调用resolve来触发 4.3、redux-sage...redux-saga将react的同步操作与异步操作区分开来,以便于后期的管理与维护 ,redux- saga相当于Redux原有数据流多了一层,通过对Action进行监听,从而捕获到监听的Action

4.3K30

ReactRedux

Action相当于事件模型的事件,描述发生了什么。Reducer相当于事件模型的监听器,接收一个旧的状态和一个action,从而处理state的更新逻辑,返回一个新的状态,存储到Store。...现在我们可以开发一个函数来做为主 reducer调用多个子 reducer 分别处理 state 的一部分数据,然后再把这些数据合成一个大的单一对象。...负责管理全局 state 负责的一部分。...再次说明Redux应用只有一个单一的store。 当需要拆分处理数据逻辑,我们应该使用 reducer 组合 而不是创建多个 store。 根据已有的reducer来创建store是非常容易的。...当过早 return 非常容易犯这个错误,为了避免错误扩散,遇到这种情况 combineReducers 会抛异常。

4K20
  • React:Redux怎么处理异步?

    至此,我们可以看出 Reducer 必须是同步函数 不能放置异步逻辑 (注:Redux要求Reducer必须是“纯函数”!) ---- 那么,问题来了... Redux应该在处理异步逻辑? ?...异步逻辑应放置 Redux中间件处理 !! Middleware !! (就是下面要提到的redux-thunk、redux-promise) ?...redux-promise:基于Promise的异步处理redux-promise-middleware:还是Promiseredux-saga:最优雅!最复杂! ? ?...总结: redux-thunk 允许我们 dispatch 一个包含异步处理逻辑函数(thunk);优点是我们可以借助这种简单的机制 redux 处理异步逻辑;缺点是这会让 action 变的不纯粹...业务逻辑实质还是集中 action 处理,变更了 action 原本的含义; ?

    2.7K30

    Redux开发实用教程

    Redux没有Dispatcher:使用Store的Store.dispatch()方法来把action传给Store,由于所有的action处理都会经过这个Store.dispatch()方法,所以...虽然React 试图视图层禁止异步和直接操作 DOM 来解决这个问题。美中不足的是,React 依旧把处理 state 数据的问题留给了你。Redux就是为了帮你解决这个问题。...不过,大型应用把它们显式地定义成常量还是利大于弊的。 Action 创建函数 Action 创建函数 就是生成 action 的方法。...,每个 reducer 根据它们的 key 来筛选出 state 的一部分数据并处理,然后这个生成的函数再将所有 reducer 的结果合并成一个大的对象。...当需要拆分数据处理逻辑,你应该使用 reducer 组合 而不是创建多个 store; redux一个特点是:状态共享,所有的状态都放在一个store,任何component都可以订阅store的数据

    1.4K20

    单向数据流-从共享状态管理:fluxreduxvuex漫谈异步数据处理

    redux与flux对比 Flux Store 是各自为战的,每个 Store 只对对应的 View 负责,每次更新都通知对应的View Redux 各子 Reducer 都是由根 Reducer...缺点就是用户要写的代码有点多,可以看到上面的代码比较啰嗦 而promise只是action的payload作为一个promise,中间件内部进行处理之后,发出新的action。...redux-saga 采用了另外一种思路,没有把异步操作放在 action creator ,也没有去处理 reductor,而是把所有的异步操作看成“线程”,可以通过普通的action去触发,当操作完成也会触发...redux-saga 把异步获取数据这类的操作都叫做副作用(Side  Effect),的目标就是把这些副作用管理好,让他们执行更高效,测试更简单,处理故障更容易。...这样看来认为VUE是更推荐使用了VUEX的框架的每个组件内部都使用store,而React-Redux则提供了自由选择性。

    3.7K40

    redux-saga

    作为一个Redux中间件,想让Redux应用的副作用(即依赖/影响外部环境的不纯的部分)处理起来更优雅 二.设计理念 Saga像个独立线程一样,专门负责处理副作用,多个Saga可以串行/并行组合起来,...,更符合顺序执行的直觉 以同步形式捕获异步错误,优雅地捕获异步错误 P.S.关于generator与iterator的关系及generator基础用法,可以参考generator(生成器)_ES6笔记2...所以添一层描述对象来解决这个问题,测试case可以简单比较描述对象,实际起作用的Promiseredux-saga内部生成 这样做的好处是单测不用mock异步方法(一般单测中会把所有异步方法替换掉...error,当前saga也会结束 另外,cancel机制比较有意思: 对于执行的task序列,所有task自然完成,把结果向上传递到队首,作为上层某个yield的返回值。...的副作用提到了外面,保证了reducer的纯度 六.优缺点 优点: 易测试,提供了各种case的测试方案,包括mock task,分支覆盖等等 大而全的异步控制库,从异步流程控制到并发控制应有尽有 完备的错误捕获机制

    1.9K41

    Redux 入门教程(二):中间件与异步操作

    上一篇文章,介绍了 Redux 的基本做法:用户发出 Action,Reducer 函数算出新的 State,View 重新渲染。 但是,一个关键问题没有解决:异步操作怎么办?...Action 发出以后,Reducer 立即算出 State,这叫做同步;Action 发出以后,过一段时间再执行 Reducer,这就是异步。 怎么才能 Reducer 异步操作结束后自动执行呢?...(1)Reducer:纯函数,承担计算 State 的功能,不合适承担其他功能,也承担不了,因为理论上,纯函数不能进行读写操作。...比如,上一节的日志中间件,就有现成的redux-logger模块。这里介绍怎么使用中间件。...注意,createAction的第二个参数必须是一个 Promise 对象。 看一下redux-promise的源码,就会明白内部是怎么操作的。

    1.4K40

    一文梭穿Vuex、Flux、ReduxRedux-saga、Dva、MobX

    Store 是各自为战的,每个 Store 只对对应的 View 负责,每次更新都通知对应的View: Redux 各子 Reducer 都是由根 Reducer 统一管理的,每个子 Reducer...实际项目中,一般都会有同步和异步操作,所以 Flux、Redux 之类的思想,最终都要落地到同步异步的处理来。...redux-saga 采用了另外一种思路,没有把异步操作放在 action creator ,也没有去处理 reductor,而是把所有的异步操作看成“线程”,可以通过普通的action去触发,当操作完成也会触发...redux-saga 把异步获取数据这类的操作都叫做副作用(Side Effect),的目标就是把这些副作用管理好,让他们执行更高效,测试更简单,处理故障更容易。...代码异常/请求失败 都可以直接通过 try/catch 语法直接捕获处理。* 很容易测试,如果是 thunk 的 Promise,测试的话就需要不停的 mock 不同的数据。

    5.5K10

    从应用到源码-深入浅出Redux

    action 表示本次处理的动作,必须拥有 type 属性。...需要额外注意的是, redux 要求每个 reducer 函数匹配到对应的 action 需要返回一个全新的对象(两个对象拥有完全不同的内存空间地址)。...这样子组件仍然需要关联 Redux 的 dispatch 方法进行处理,这显然是不太合理的。 Redux 提供了 bindActionCreators API来帮助我们解决这个问题。...需要留意的一点是通过 dispatch 触发 action 多个 reducer 之间刻意使用了流通这个关键字是有原因的,我们会在稍微详细解释到。...applyMiddleware 上边我们 Redux 中使用中间件的时候 createStore 传入了第三个参数,并且使用 applyMiddleware 包裹了

    1.3K10

    状态管理的概念,都是纸老虎

    实际项目中,一般都会有同步和异步操作,所以 Flux、Redux 之类的思想,最终都要落地到同步异步的处理来。...redux-thunk 和 redux-promise 刚好就是代表这两个面。 redux-thunk 和 redux-promise 的具体使用就不介绍了,这里聊一下大概的思路。...redux-saga 采用了另外一种思路,没有把异步操作放在 action creator ,也没有去处理 reductor,而是把所有的异步操作看成“线程”,可以通过普通的action去触发,当操作完成也会触发...redux-saga 把异步获取数据这类的操作都叫做副作用(Side Effect),的目标就是把这些副作用管理好,让他们执行更高效,测试更简单,处理故障更容易。...代码异常/请求失败 都可以直接通过 try/catch 语法直接捕获处理。* 很容易测试,如果是 thunk 的 Promise,测试的话就需要不停的 mock 不同的数据。

    5.3K20

    深入学习 Redux 之中间件与异步操作

    Action 发出以后,Reducer 立即算出 State,这是同步;Action 发出以后,过一段时间再执行 Reducer,这就是异步。 怎么才能 Reducer 异步操作结束后自动执行呢?...一、什么是中间件 ---- 如果我们是框架作者,要添加功能,会在哪个环节添加: ① Reducer:纯函数,承担计算 State 的功能,不合适承担其他功能,而且理论上纯函数不能进行读写操作。...中间件就是一个函数,对store.dispatch方法进行了改造,发出 Action 和执行 Reducer 这两步之间,添加了其他功能。...createStore( reducer, applyMiddleware(logger) ) 上面代码redux-logger 提供一个生成器 createLogger,可以生成日志中间件...注意,createAction的第二个参数必须是一个 Promise 对象。 看一下 redux-promise 的源码,就会明白内部是怎么操作的。

    1.1K20

    一天梳理完react面试高频题

    这种机制可以让我们改变数据流,实现如异步action ,action 过滤,日志输出,异常报告等功能redux-logger:提供日志输出redux-thunk:处理异步操作redux-promise:...异步的请求怎么处理可以 componentDidmount 中直接进⾏请求⽆须借助redux。...但是⼀定规模的项⽬,上述⽅法很难进⾏异步流的管理,通常情况下我们会借助redux的异步中间件进⾏异步处理。...” thunk function异常处理: 受益于 generator function 的 saga 实现,代码异常/请求失败 都可以直接通过 try/catch 语法直接捕获处理功能强⼤: redux-saga...React Fiber 的目标是增强其动画、布局和手势等领域的适用性。的主要特性是增量渲染:能够将渲染工作分割成块,并将其分散到多个帧

    4.1K20

    Redux

    一.作用 与Flux一样,作为状态管理层,对单向数据流做强约束 二.出发点 MVC,数据(Model)、表现层(View)、逻辑(Controller)之间有明确的界限,但数据流是双向的,大型应用尤其明显...更新view的时机 异步操作结束后,dispatch action修改state,更新view 不用考虑多个异步操作的时序问题,因为从action历史记录来看,顺序是固定不变的,同步还是异步过程dispatch...的不重要 与同步场景没太大区别,只是action多一些,一些中间件(redux-thunk、redux-promise等等)只是让异步控制形式上更优雅,从dispatch action角度看没有区别 reducer...(或者抽象出reducer factory) 单一职责 每一个reducer负责全局状态的一部分 纯函数reducer的具体约束(与FP的纯函数概念一致)如下: 不修改参数 只是单纯的计算,不要掺杂副作用...UI状态变化可能不需要作为store的一部分,而应该在组件级来维护) 把state看做数据库 对于复杂的应用,应该把state当做数据库,存放数据建立索引,关联数据之间通过id来引用。

    1.3K40

    redux-saga_pub culture

    最初的调研redux-thunk是首先考虑的,redux-thunk是action作用到reducer之前触发一些业务操作。刚好起到控制层的作用。...拿到后端返回状态 (promise so easy…) 隐藏提示信息 (这个有点难度,不过难不倒给组建加一个控制属性) 更新redux store (dispatch咯。。。)...put方法 put就是redux的dispatch,用来触发reducer更新store 有什么弊端 目前项目实践遇到的一些问题: redux-saga模型的理解和学习需要投入很多精力 因为需要用...action触发,所以会产生很多对于reducer无用的action, 但是reducer一样会跑一轮,虽然目前没有观测到性能下降,但还是有计算开销 action的定义上要谨慎,避免actionsaga...和reducer之间重复触发,造成死循环 后记 总体而言,对于redux-saga的第一次尝试还是很满意的。

    1.4K10

    2022前端笔试题总结

    也就是说你.finally()函数是无法知道Promise最终的状态是resolved还是rejected的它最终返回的默认会是一个上一次的Promise对象值,不过如果抛出的是一个异常则返回异常的...) .catch(err => { console.log('捕获错误', err) })输出结果为:'finally1''捕获错误' Error: 是finally抛出的异常常见的浏览器内核比较...Redux 的核心设计包含了三大原则:单一数据源、纯函数 Reducer、State 是只读的。...这就造成纯函数设计的 Redux 处理副作用变成了一件至关重要的事情。...第二类是允许 Reducer 层中直接处理副作用,采取该方案的有 React Loop,React Loop 实现采用了 Elm 中分形的思想,使代码具备更强的组合能力。

    2.1K40
    领券