开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

Promise不会在redux thunk中得到回报

Promise是JavaScript中一种处理异步操作的机制。它代表了一个异步操作的最终完成或失败，并可以返回一个结果值。在Redux Thunk中，Promise可以用于处理异步操作，例如发起网络请求或执行耗时的计算。

在Redux Thunk中，当我们需要执行一个异步操作时，可以使用Promise来封装这个操作。我们可以创建一个返回Promise的函数，并将其作为参数传递给Redux Thunk中间件的dispatch方法。这样，我们就可以在异步操作完成后，通过Promise的resolve或reject来触发相应的Redux action。

Promise的优势在于它提供了一种更优雅和可读性更高的方式来处理异步操作。它可以避免回调地狱（callback hell）的问题，使代码更加清晰和易于维护。同时，Promise还提供了丰富的方法，如then、catch、finally等，可以方便地处理异步操作的不同状态和结果。

在Redux Thunk中使用Promise的一个常见场景是发起网络请求。我们可以使用fetch或axios等库来发送HTTP请求，并将其封装成一个返回Promise的函数。在这个函数中，我们可以使用resolve来返回请求成功的结果，使用reject来返回请求失败的原因。这样，我们就可以在Redux中通过dispatch来触发相应的action，并在action中处理异步操作的结果。

对于Promise的使用，腾讯云提供了一些相关的产品和服务。例如，腾讯云函数（SCF）可以帮助开发者快速构建和部署无服务器应用，并支持使用Promise来处理异步操作。此外，腾讯云还提供了云数据库MySQL、云数据库MongoDB等数据库产品，可以与Promise结合使用，实现数据的异步读写操作。

更多关于腾讯云相关产品和服务的信息，可以访问腾讯云官方网站：腾讯云。

相关搜索:Promise永远不会在javascript中解析 REDUX THUNK ASYNC等待返回Promise中间件 Redux thunk返回一个promise而不是一个已解析的值 Redux/Thunk中的递归函数返回Promise对象，而不是常规对象使用redux-thunk分派去抖动函数中的操作使用thunk在redux中测试异步中间件使用thunk处理redux操作中的承诺使用typescript在Redux thunk中返回promise 在redux thunk中捕获在redux thunk分派后从商店返回promise

相关搜索:

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

理解 React 中的 Redux-Thunk

借助 Redux Thunk，我们可以异步 dispatch 这些操作并返回 promise 处理的结果。...下面我们来实操下：设置工作环境假设你已经通过 create-react-app 生成了一个 redux 项目，参考 React Js 中创建和使用 Redux Store。...通过 npm install redux-thunk --save 或者 yarn add redux-thunk 进行安装。...Redux store 只允许同步 dispatch actions，并且一个 Redux store 中不会有任何异步逻辑。它只会明白怎么同步去 dispatch 事件并更新 state。...怎么使用 Redux Thunk: 构建一个购物车在本教程中，我们将使用 Redux Thunk 开发一个简单的购物车功能，更好地明白 Thunk 怎么工作。

3772 0

React：Redux怎么处理异步？

异步逻辑应放置在 Redux中间件中处理 !! Middleware !! （就是下面要提到的redux-thunk、redux-promise） ?...dispatch 一个 thunk函数； redux-thunk 中间件允许你 dispatch 一个函数（即：thunk），异步逻辑就放在这个函数中处理；感受一波redux-thunk的精炼 ?...总结： redux-thunk 允许我们 dispatch 一个包含异步处理逻辑函数（thunk）；优点是我们可以借助这种简单的机制在 redux 中处理异步逻辑；缺点是这会让 action 变的不纯粹...((dispatch, getState) => { ... }) 注：redux-thunk 允许我们 dispatch 一个 thunk函数； redux-promise: store.dispatch...redux-promise应用示例 ? 总结： redux-promise 虽然比 redux-thunk 封装的更深，但仍然存在几个问题： a.

2.6K3 0

Redux 入门到高级教程

安装 npm install redux-thunk 配置中间件 import { createStore, applyMiddleware } from 'redux'; import thunk from...另一种异步操作的解决方案，就是让 Action Creator 返回一个 Promise 对象。这就需要使用redux-promise中间件。...'; import thunk from 'redux-thunk' import redudxPromise from 'redux-promise'; import {composeWithDevTools...如果mapDispatchToProps是一个函数，会得到dispatch和ownProps（容器组件的props对象）两个参数。...'; import thunk from 'redux-thunk' import redudxPromise from 'redux-promise'; import {composeWithDevTools

2.6K3 0

Redux异步解决方案 1. Redux-Thunk中间件

简单介绍一下thunk，这是一个中间件，是解决redux异步问题产生的。...redux比较常用的中间件有 redux-saga、redux-thunk、redux-promise等都是为了解决dispatch action异步处理问题 redux中间件对redux应用实现异步...使用 thunk 等中间件可以帮助在 Redux 应用中实现异步性。...可以将 thunk 看做 store 的 dispatch() 方法的封装器；我们可以使用 thunk action creator 派遣函数或 Promise，而不是返回 action 对象。...} from 'redux'; import thunk from 'redux-thunk'; import {add, deleter} from '.

1.2K2 0

react知识总结_六年级教学工作总结个人

import thunk from 'redux-thunk'; import { createLogger } from 'redux-logger'; const logger = createLogger...这种异步思路就是使用 Action Creator 返回一个函数，然后使用 redux-thunk 让 dispatch 能够接受一个函数作为参数。...redux-promise import thunk from 'redux-thunk'; import { createLogger } from 'redux-logger'; import...logger) // 按照严格的循序 ); 上一种方法是使用 Action Creator 返回函数来操作异步，使用 redux-promise 可以让它返回一个 promise 对象，可以使用...{ dispatch(deleteUser(index)) }, 2000) })) } 使用 redux-promise 让它能够返回一个使用 promise ，接着我们调用

6482 0

【Redux】：Redux 指北

有哪些异步处理中间件 9.3. redux-thunk 9.4. redux-promise 9.5. redux-promise-middleware 9.6. 总结一下 10....有哪些异步处理中间件 redux-thunk：不到10行代码，精简到炸！...redux-promise：基于Promise的异步处理； redux-promise-middleware：还是Promise； redux-saga：最优雅！最复杂！...9.3. redux-thunk redux-thunk 中间件扩展了 redux 的 dispatch 功能，它允许你 dispatch 一个函数（即：thunk），异步逻辑就放在这个函数中处理；源码...： redux-thunk 允许 dispatch 一个 thunk 函数； store.dispatch((dispatch, getState) => { ... }) redux-promise

1.5K4 0

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

, promise, logger) ) 上面代码中，applyMiddleware 方法的三个参数，就是三个中间件。...这时，就要使用中间件 redux-thunk。...import { createStore, applyMiddleware } from 'redux'; import thunk from 'redux-thunk'; import reducer...(thunk) ); 上面代码使用 redux-thunk 中间件，改造 store.dispatch，使得后者可以接受函数作为参数。...另一种异步操作的解决方案，就是让 Action Creator 返回一个 Promise 对象。这就需要使用 redux-promise 中间件。

1.1K2 0

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

上边我们按照步骤实现了一个简单的 Redux-Thunk 中间件，它支持我们传入的 action 类型为一个函数。此时我们就可以在 Redux 中完美的使用异步 Action 。...，换言之在真正派发 dispatch 时中间件的执行顺序应该是相反的，也就是从左往右先执行 logger、thunk最后为promise 最后再到真实 store 中的 disaptch。...中间件 promise中间件 dispatch 复制代码最后我们再来一起看看 Redux 中 compose 的源码：其实在你搞清楚上述我们实现的 compose 后在看看源码中的 compose...(promise(dispatch)) // 当调用 next(action) 时，相当于调用 thunk(promise(disaptch))(action) // 依次继续执行 thunk middleware...中的逻辑，同时执行到 thunk 中的 next 时，传递了 action 相当于调用 promise(disaptch)(action) // 继续进入 promise 中进行执行，由于 promise

1.3K1 0

造一个 redux-thunk 轮子

redux-thunk 不就是那个只有 14 行代码的轮子嘛？我一行就能写出来还要你来教我做事？不错，redux-thunk 是一个非常小的库，不到 5 分钟就能理解并造出来。...本文希望从解决问题的角度来推导 redux-thunk 诞生的原因。...加载中......解耦上面的代码在很多业务里非常常见，常见到我们根本不需要什么 redux-thunk，redux-saga 来处理。...redux-thunk 到底解决了什么问题？

7293 0

Redux 入门教程（二）：中间件与异步操作

const store = createStore( reducer, applyMiddleware(thunk, promise, logger) ); 上面代码中，applyMiddleware...这时，就要使用中间件redux-thunk。...import { createStore, applyMiddleware } from 'redux'; import thunk from 'redux-thunk'; import reducer...(thunk) ); 上面代码使用redux-thunk中间件，改造store.dispatch，使得后者可以接受函数作为参数。...另一种异步操作的解决方案，就是让 Action Creator 返回一个 Promise 对象。这就需要使用redux-promise中间件。

1.4K4 0

redux-thunk 中间件的示例

redux-thunk 简介 Redux处理异步任务——异步数据流中间件：redux-thunk & action是一个函数，函数内部处理异步任务注意：默认情况下，redux自身只会处理同步数据流。...但是，如果涉及到异步操作，就应该使用 redux-thunk 这种的中间件，来处理异步数据流！！！...使用了redux-thunk中间件以后，我们需要修改action redux-thunk的使用安装，引入 npm install redux-thunk // 下载两个中间件, redux-thunk...的区别，注意是dispatch中的action是一个函数 import {connect} from 'react-redux' import {userLoginAction} from "./.....(dispatch)=>{ // 在此处，就可以处理异步操作了 // 也就是，异步代码就可以放在此处执行了 return new Promise((resolve

5352 0

Redux异步解决方案之Redux-Thunk原理及源码解析

前段时间，我们写了一篇Redux源码分析的文章，也分析了跟React连接的库React-Redux的源码实现。但是在Redux的生态中还有一个很重要的部分没有涉及到，那就是Redux的异步解决方案。...你可能会发现很多例子都返回了Promise，这个不是必须的，但是用起来却很方便。Redux并不关心你的thunk返回了什么值，但是他会将这个值通过外层的dispatch()返回给你。...这就是为什么你可以在thunk中返回一个Promise并且等他完成： dispatch(someThunkReturningPromise()).then(...)...这是因为thunk提供的dispatch也可以接收thunk，所以你可以一直嵌套的dispatch thunk。而且结合Promise的话可以更好的控制异步流程。...Redux中间件范式在我前面那篇讲Redux源码的文章讲过中间件的范式以及Redux中这块源码是怎么实现的，没看过或者忘了的朋友可以再去看看。

3.4K5 1

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

从简单的 react-thunk 到 redux-promise 再到 redux-saga等等，都代表这各自解决redux异步流管理问题的方案 4.1 、redux-thunk redux-thunk...尽管redux-thunk很简单，而且也很实用，但人总是有追求的，都追求着使用更加优雅的方法来实现redux异步流的控制，这就有了redux- promise。...4.2、redux-promise 使用redux-promise中间件，允许action是一个promise，在promise中，如果要触发action，则通过调用resolve来触发 4.3、redux-sage...一般项目redux-thunk就足以满足自身需求了。毕竟react- thunk对于一个项目本身而言，毫无侵入，使用极其简单，只需引入这个中间件就行了。...'redux-thunk' import reducer from '.

3.9K3 0

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

也就是说，任何被发送到 store 的 action 现在都会经过thunk，promise，logger 这几个中间件了。...比如 redux-thunk 或 redux-promise,分别是使用异步回调和 Promise 来解决异步 action 问题的。...缺点就是用户要写的代码有点多，可以看到上面的代码比较啰嗦而promise只是在action中的payload作为一个promise，中间件内部进行处理之后，发出新的action。...**redux-thunk 和 redux-promise 刚好就是代表这两个面。当业务逻辑多且复杂的时候会发生什么情况呢？...redux-saga的优势 Redux 处理异步的中间件 redux-thunk 和 redux-promise，当然 redux 的异步中间件还有很多，他们可以处理大部分场景，这些中间件的思想基本上都是把异步请求部分放在了

3.6K4 0

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

显然，用 Redux 处理异步，可以自己写中间件来处理，当然大多数人会选择一些现成的支持异步处理的中间件。比如 redux-thunk 或 redux-promise 。...Redux-promise redus-promise 和 redux-thunk 的思想类似，只不过做了一些简化，成功失败手动 dispatch 被封装成自动了： const FETCH_DATA =...redux-thunk 和 redux-promise 刚好就是代表这两个面。 redux-thunk 和 redux-promise 的具体使用就不介绍了，这里只聊一下大概的思路。...大部分简单的异步业务场景，redux-thunk 或者 redux-promise 都可以满足了。上面说的 Flux 和 Redux，和具体的前端框架没有什么关系，只是思想和约定层面。...刚才介绍了两个Redux 处理异步的中间件 redux-thunk 和 redux-promise，当然 redux 的异步中间件还有很多，他们可以处理大部分场景，这些中间件的思想基本上都是把异步请求部分放在了

5.4K1 0

Redux开发实用教程

为了使用异步action我们需要引入redux-thunk库，redux-thunk是为Redux提供异步action支持的中间件。...使用redux-thunk npm install --save redux-thunk import thunk from 'redux-thunk' let middlewares = [...像 redux-thunk 或 redux-promise 这样支持异步的 middleware 都包装了 store 的 dispatch() 方法，以此来让你 dispatch 一些除了 action...以外的其他内容，例如：函数或者 Promise。...比如，支持 Promise 的 middleware 能够拦截 Promise，然后为每个 Promise 异步地 dispatch 一对 begin/end actions。

1.4K2 0

redux-saga_pub culture

在最初的调研中redux-thunk是首先考虑的，redux-thunk是在action作用到reducer之前触发一些业务操作。刚好起到控制层的作用。...拿到后端返回状态（promise so easy…）隐藏提示信息 (这个有点难度，不过难不倒我，我给组建加一个控制属性) 更新redux store （dispatch咯。。。）...call方法 call有些类似Javascript中的call函数，不同的是它可以接受一个返回promise的函数，使用生成器的方式来把异步变同步。...put方法 put就是redux的dispatch，用来触发reducer更新store 有什么弊端目前在项目实践中遇到的一些问题： redux-saga模型的理解和学习需要投入很多精力因为需要用...在重用方面，解耦显示层和业务层之后，代码的重用度也得到了提升。选择Saga的原因开始的时候一直在犹豫是否需要使用Saga或thunk，因为并不能很好的把握这两者到底解决了什么问题。

1.4K1 0

【JS】336- 拆解 JavaScript 中的异步模式

提到 thunk，你可能马上就会想到 redux-thunk，其对自己的定义如下： Redux Thunk middleware allows you to write action creators...在 Promise 中，时间也被抽离了出去。...直到看到 redux-saga 的作者明确表明不会使用 async await 取代 generator 来重写 redux-saga [8]才意识到 async 函数还是有很多缺陷的。...我们知道 Excel 非常强大，我们可以选中 Excel 中的若干单元格进行复杂的运算后，并将结果存储到另外一个单元格中。随后如果前面的单元格中任意一个地方的值有所改变，之前得到的结果也会跟着改变。...在我的大部分工作中，我其实觉得 Promise 就够用了。

8033 0

【JS】285- 拆解 JavaScript 中的异步模式

提到 thunk，你可能马上就会想到 redux-thunk，其对自己的定义如下： Redux Thunk middleware allows you to write action creators...在 Promise 中，时间也被抽离了出去。...直到看到 redux-saga 的作者明确表明不会使用 async await 取代 generator 来重写 redux-saga [8]才意识到 async 函数还是有很多缺陷的。...我们知道 Excel 非常强大，我们可以选中 Excel 中的若干单元格进行复杂的运算后，并将结果存储到另外一个单元格中。随后如果前面的单元格中任意一个地方的值有所改变，之前得到的结果也会跟着改变。...在我的大部分工作中，我其实觉得 Promise 就够用了。

8092 1

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

显然，用 Redux 处理异步，可以自己写中间件来处理，当然大多数人会选择一些现成的支持异步处理的中间件。比如 redux-thunk 或 redux-promise 。...Redux-promise redus-promise 和 redux-thunk 的思想类似，只不过做了一些简化，成功失败手动 dispatch 被封装成自动了： const FETCH_DATA =...redux-thunk 和 redux-promise 刚好就是代表这两个面。 redux-thunk 和 redux-promise 的具体使用就不介绍了，这里只聊一下大概的思路。...大部分简单的异步业务场景，redux-thunk 或者 redux-promise 都可以满足了。上面说的 Flux 和 Redux，和具体的前端框架没有什么关系，只是思想和约定层面。...刚才介绍了两个Redux 处理异步的中间件 redux-thunk 和 redux-promise，当然 redux 的异步中间件还有很多，他们可以处理大部分场景，这些中间件的思想基本上都是把异步请求部分放在了

5.2K2 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭