redux thunk和redux promise之间的区别是什么

What is the difference between redux-thunk and redux-promise?

本文关键字：redux 区别 是什么 promise thunk 之间      更新时间：2024-05-10

据我所知，如果我错了，redux thunk是一个中间件，它可以帮助我们调度异步函数并调试操作本身中的值，而当我使用redux promise时，如果不实现自己的机制，我就无法创建异步函数，因为action抛出了只调度普通对象的异常。

这两个方案的主要区别是什么？在一个页面react应用程序中使用这两个包有什么好处吗？或者坚持使用redux thunk就足够了？

redux-thunk允许操作创建者返回一个函数：

function myAction(payload){
    return function(dispatch){
        // use dispatch as you please
    }
}

redux-promise允许他们返回一个承诺：

function myAction(payload){
    return new Promise(function(resolve, reject){
        resolve(someData); // redux-promise will dispatch someData
    });
}

如果需要异步或有条件地调度操作，那么这两个库都很有用。redux-thunk还允许您在一个动作创建者内进行多次调度。你是选择其中一个、另一个还是两者都选择，完全取决于你的需求/风格。

您可能希望/需要在您的应用程序中同时使用这两者从产生异步任务的常规promise的redux promise开始，然后随着复杂性的增加，扩展到添加Thunks（或Sagas等）：

  • 当生活很简单，你只需要与返回一个承诺的创建者进行基本的异步工作，那么redux-promise将快速而简单地改善你的生活并简化它。（简言之，redux promise（-中间件）不用考虑在承诺解决后"打开"承诺，然后编写/发送结果，而是为您处理所有无聊的事情。）
  • 但是，当出现以下情况时，生活会变得更加复杂：
  • 也许你的动作创建者想要生成几个承诺，你想将其作为单独的动作发送给单独的减速器
  • 或者，在决定如何以及在哪里发送结果之前，您需要管理一些复杂的预处理和条件逻辑

在这些情况下，redux-thunk的好处是，它允许您在操作创建者内部封装复杂性。

但请注意，如果您的Thunk生成并发送承诺，那么您将希望同时使用这两个库：

  • 雷神会编写原始动作并将其发送出去
  • 然后，redux-promise将在减速器处处理由Thunk生成的单个承诺的展开，以避免由此产生的样板。（你可以用promise.then(unwrapAndDispatchResult).catch(unwrapAndDispatchError)在Thunks中做所有事情……但你为什么要这样做？）

总结用例差异的另一种简单方法是：Redux操作周期的开始与结束：

  • Thunks适用于Redux流的开始：如果您需要创建复杂的操作，或者封装一些粗糙的操作创建逻辑，将其排除在组件之外，当然也排除在减速器之外
  • redux-promise用于你的流程，一旦一切都归结为简单的承诺，你只想打开它们，并将其解决/拒绝的价值存储在商店中

注/参考文献：

  • 我发现redux-promise-middleware是原始redux-promise背后思想的一个更完整、更容易理解的实现。它正在积极开发中，redux-promise-reducer也很好地补充了它
  • 还有其他类似的中间件可用于编写/排序复杂的操作：一个非常流行的中间件是redux-saga，它与redux-thunk非常相似，但基于生成器函数的语法。同样，你可能会将其与redux-promise结合使用，因为sagas生产的产品承诺你不想用大量的样板手动打开包装和处理
  • 这是一篇很好的文章，直接比较了各种异步组合选项，包括thunk和redux-promise中间件。（TL；DR:"与其他一些选项相比，Redux Promise中间件显著减少了样板文件"…"我想我喜欢Saga用于更复杂的应用程序（读作："使用"），和Redux PromiseMiddleware用于其他一切"）
  • 请注意，在一个重要的情况下，您可能认为需要调度多个操作，但实际上没有，您可以保持简单的事情。这就是您只希望多个还原器对单个异步调用做出反应的地方，并且您倾向于将多个操作分派给这些多个还原程序。但是，根本没有理由让多个减速器无法监控单个动作类型你只需要确保你的团队知道你在使用这个约定，这样他们就不会认为只有一个减速器（具有相关名称）可以处理给定的操作

全面披露：我对Redux开发相对陌生，自己也很难回答这个问题。我将转述我发现的最简洁的答案：

ReduxPromise在调度操作时返回一个promise作为有效负载，然后ReduxPromise中间件将解析该promise并将结果传递给reducer。

另一方面，ReduxThunk迫使动作创建者推迟将动作对象实际调度到reducers，直到调用调度。

这里有一个教程的链接，我在那里找到了这些信息：https://blog.tighten.co/react-101-part-4-firebase.

相关文章：