我可以在没有 action creators 和 reducers 的情况下在 React 和 Redux 中发送 AJAX 调用吗？

Posted 2023-02-22

【中文标题】我可以在没有 action creators 和 reducers 的情况下在 React 和 Redux 中发送 AJAX 调用吗？

【英文标题】：Can I send an AJAX call in React and Redux without action creators and reducers?

【发布时间】：2016-08-06 17:58:45

【问题描述】：

我有一些 ajax 请求没有直接操纵我的应用程序状态。在 react/redux 应用程序中，是否有必要（或者有什么好处）为这些 ajax 请求分派一个操作，而不是直接在组件中发送一个 ajax 请求？

为了简化我的场景，我基本上有一个关于我的 redux 状态的对象列表。我正在使用表单将新对象发布到数据库，成功发布后，我将重定向到发送 GET 请求并获取列表并更新状态的列表页面。

发布新对象的 AJAX 调用并未直接操纵我的状态。

与我合作的团队正在完成完整的 3 步 redux 异步步骤 例如：'FETCH_REQUESTED'、'FETCH_SUCCESS'、'FETCH_FAIL' 以及所有 AJAX 请求的相应减速器，添加更多是一个很大的麻烦，减速器似乎没有意义。

【参考方案1】：

您绝对可以直接从组件发送 AJAX 调用！

Redux 是一种工具，可让多个组件全局使用共享状态，并以可预测的方式进行更改。在任何情况下，如果您认为没有必要，请不要这样做。

当不同的组件发出相同的 API 请求然后以类似的方式更改状态时，在动作创建器中保留 AJAX 调用很方便。如果您希望避免在已经有一些缓存数据可用时触发请求，并且希望将此类检查保存在一个地方而不是分散在各个组件中，这也很方便。

也就是说 Redux 只关心全局状态是如何更新的，如果你只需要从某个组件发出 AJAX 请求，你不必为它编写 action creator 或 reducer，除非你觉得方便.

一般来说，当您有许多复杂的组件时，您可能会考虑将代码重构为 Redux（和 Flux）。不是你应该从每个组件开始的。您可以只使用您需要的部分（例如，只使用同步的东西），甚至在某些情况下完全避免使用它（例如，可折叠面板不必将其状态存储在商店中）。仅当您了解它在特定情况下为您带来的具体好处时才使用它，绝不是“以防万一”或因为它很受欢迎。

另见my answer to “How do dispatch a Redux action with a timeout?”

为了解决您的具体示例，如果您使用 Redux 为您提供的好处，您可能希望使用 Redux：也许您调度一个操作以乐观地更新表单并立即显示新列表，并将其与获取的列表合并列出可用时，以便交互显示为即时的。 那是异步动作创建者的用例。如果您不考虑这种 UX 复杂性，我不确定 Redux 是否必要。

【讨论】：

跟进 Dan Abramov 的回答 - 您可能想要使用 - github.com/gavriguy/react-indie 它是专门为您不想连接的独立组件（如小部件）制作的组件（我刚刚制作）设计为全局状态。

@DanAbramov 只是一个问题：如果您不将可折叠面板状态放入商店，您将无法从时间旅行和 webpack 热重载中受益，对吧？

是的，但是您多久花一次时间调试可折叠面板逻辑？ ;-)

【参考方案2】：

试试下面的链接

https://github.com/sskyy/redux-task

它可以帮助您管理 AJAX 请求状态，而无需那些冗长的操作和 reducer。