javascript - 我什么时候应该在我的 React 应用程序中使用 Redux？

Question

我正在开发一个 React 网络应用程序，我们公司购买了一个管理仪表板面板以节省时间。在这个面板中，他们使用 redux 来处理状态并将所有设置参数存储到 redux ...

但我真的对为每个用例使用 Redux 感到困惑!

我所有的请求和状态都是基于组件的，不是全局的，而且这些对于在这个应用程序的其他组件中使用不是必需的!

例如加载游戏列表我有这个代码:

componentDidMount() {
    this.setState({
      loading: true
    });
    http._GET('/game/getAllGames')
    .then(response => {
      this.setState({
        loading: false
      });
      this.props.dispatch(gamesListAction(response.data.result.games));
    });
  }

在这种情况下，我只在游戏列表页面上使用响应和列表。所以我认为将 response.data 存储到 redux 中然后通过连接和另一个进程获取所有数据是不合逻辑的......

或者另一个例子，对于插入表单，我永远不需要存储表单插入或 API 响应，因为它被插入并且没有从 API 获取数据!

我读过 redux，但我认为 redux 并不适合所有应用程序和用例，我不应该存储对 redux 的一次性响应。

Answer 1

reduxjs FAQ描述得最好。

一般来说，当您有合理数量的数据随时间变化时使用 Redux，您需要一个单一的事实来源，并且您发现将所有内容保持在顶级 React 组件状态中的方法不再足够.

Redux 只不过是一个状态管理工具，你需要更有说服力的理由来使用它:对于您的情况，首先:

• React 的 setState 会随着不断增长的需求使组件超时膨胀更难维护。将状态管理分离到 reducer 中很好地重构并使其更具可读性。
• 缓存组件状态，例如，如果您正在使用购物车、渐进式向导。在这种情况下，用户交互中有很多来回导致状态变化。在 redux 中维护你的状态现在很有意义。
• 深层嵌套的组件将状态和大量属性传递给它们的子组件，随着需求的增长而迅速膨胀。这是一个包含大量包装器组件(尤其是 UI 细节)的经典场景。更好的方法是重构并将低级组件直接连接到 redux(转换为容器。阅读:presentational-and-container-components)
• 应用程序状态映射到多个容器组件。例如，如果您的 getAllGames 加载状态在一些progressive-loader-component 在你的应用程序的某个地方。使用 redux 将减轻您在这些组件之间共享数据的痛苦。
• 在构建根级组件时非常有用，这些组件可能与来自任何地方的交互。就像您的用户帐户组件、模式、警报、加载器。

您会意识到，您正在编写一些带有操作和缩减器的样板代码。虽然加类这比 react 状态管理要好得多， react 状态管理可以在有状态组件中迅速逐渐变得复杂。