React Hooks 与 React-redux

Posted 2023-02-22

【中文标题】React Hooks 与 React-redux

【英文标题】：React Hooks Vs React-redux

【发布时间】：2019-11-08 04:19:47

【问题描述】：

在为Reactjs 引入钩子后，它们是否可以很好地替代Redux 之类的全局商店管理？这是关于他们的反应的表现。

我在最近的项目中使用了Redux 和redux-saga，但是在引入了钩子之后我有兴趣替换它们。

【问题讨论】：

在我看来，没有必要二选一。这篇文章解释了你应该如何混合两者或何时选择一个而不是另一个medium.com/javascript-scene/…

【参考方案1】：

您需要了解的一件事是，钩子并不是要取代 redux 存储，也不是用于全局存储管理。您使用钩子来简化组件的实现（用功能组件替换类组件），组件本身仍将依赖存储在 redux 存储中的一些数据。您使用 redux，以便应用中的多个组件可以使用同一个 redux 存储。

例如，假设您有两个组件：<Hello> 表示“Hello user_name”和一个 <Welcome> 表示“欢迎用户名”。现在这两个组件都需要相同的数据，即 user_name。如果我们使用 redux 存储，我们可以将数据存储在一个位置，并通过将其作为 prop 传递在整个应用程序中使用它。现在我们可以使用钩子而不是类组件来实现<Welcome> 和<Hello>，但是它们需要的数据应该来自全局存储。

【讨论】：

你不能用钩子创建一个全局状态管理器吗？不使用 redux！

@adel 嗯，用 useState() 什么的？也许，但您仍然必须手动确保您的组件在其中一个道具发生更改时全部重新呈现......它可能，但难以维护，而且这是 redux 自动执行的操作，它应该更有效。既然有一个非常好的库，为什么还要浪费时间呢？

你说得对，但我看到使用react hooks 实现的全球商店我担心的是性能它们是否相等？

就像我说的你可以用钩子实现一个全局存储。使用钩子维护全局状态的性能更好吗？老实说，我不知道。虽然我看过一些关于如何使用 hooks 实现全局存储的文章，但我从未真正看到任何理由说明为什么这比 redux 存储更好。所以我的意见是，除非你被要求这样做，否则不要这样做。我这样说是因为您以后可能会面临维护开销。但是，如果您想尝试一下，可以阅读itnext.io/…。

根据你需要的“全局状态”的程度，可以使用react hook useContext和useReducer来代替Redux