为什么 redux 比一个简单的对象更好？答案

【问题标题】：Why is redux better than a simple object?为什么 redux 比一个简单的对象更好？
【发布时间】：2018-03-14 12:36:33
【问题描述】：

我正在学习 Redux。据我了解，React 中的 Redux 帮助我们管理 React 应用程序的状态。但是为什么我不能只使用空对象来保存所有必要的状态变化呢？

例如，我有两个子组件的根组件。

<App>
   <Label/>
   <Button/>
</App>

在标签内我有状态 {numb: 1} 和一个增加 numb 的函数

increase() {
    setState(prevState => {
        return {numb: prevState.numb + 1}
    });
}

在这个组件之上，我导入了 Store.js 文件，该文件导出空对象，我用它来存储我的所有更改状态函数。

import Store from './Store'

在标签的构造函数中，我只是从那个组件中分配函数

Store.plusOne = this.increase

这有助于我在 Button 组件中导入 Store 文件，并使用增加函数来增加 Label 的 numb 属性。

<button onClick={Store.increase}>Plus One to Label's numb</button>

如果我可以将任何状态更改函数存储在单独的对象中，那么使用 Redux 有什么意义呢？

【问题讨论】：

您的组件如何“监听”存储中的变化？还是您的商店只是功能的集合 - 它也不存储状态数据？
如果您想要其他东西来响应该状态更改、另一个组件或某个 localStorage 存储，该怎么办。 Redux 为您提供了订阅者模式，因此您只有一个事实来源。数据只能通过调度一个动作来改变，一个简单的对象可以在多个地方改变，有时不那么明显。
同样，改变状态只能通过可序列化的操作来完成，以允许时间穿越变化。当您尝试调试您的应用程序时，这是一个巨大的好处。绝大多数规模相当大的 React 应用程序都在使用 redux 并非偶然。
对于 Sergiu Paraschiv：当我从另一个组件导入 Store 并使用函数时，它的执行方式与在组件内部执行的方式相同。是的，它只是函数的集合，所以所有数据和逻辑都放在组件内或从 API 中获取。对于 Keith：对于其他执行功能的组件，他们可以导入 Store 并执行功能。对于我的 Store 文件概念不起作用的情况，可以将文件与 Redux 或其他工具一起使用。
对于 trixn：是的，你说得对。它对调试没有帮助。但可能（我不确定）它可以用于复杂应用程序中的简单项目或部件，以保持组件通信简单。谢谢大家的关注。你帮我学习

【解决方案1】：

几年前我开始使用 Redux 时，我也有同样的感觉。 “伙计，这似乎过于复杂了”。但后来我意识到，虽然不使用 redux，但我在做同样的事情，但在“手动”做事情时效率较低且更容易出错。

Redux 带有一些强大的辅助函数。第一个是connect，它可以帮助您将这些状态属性放入组件中。您可以从字面上将组件连接到您的状态。您无需担心其他任何事情，只需在一个地方更改状态并观察更改在您的应用程序中的流动。

因为您“扑通”（是的，一个技术术语......咳）将该组件所需的所有属性从您的状态到组件的props，当您的状态更改时，您会自动获得组件刷新。即使在使用纯函数或 PureComponent 时，这可能对性能非常有利。

你可以这样看。如果您希望 React + Redux 自动重排您的应用程序：使用 Redux。如果您要手动更新对象并手动强制应用程序重排，请使用自定义状态对象。

话虽如此，我认为 redux 在多个组件依赖于同一状态的大型应用程序中是有意义的。如果您只是在单个组件或演示应用中通过简单的按钮单击呈现单个数据，那么您最好使用一个小对象保持简单。

【讨论】：