redux 如何处理组件状态？

Question

我使用 vanilla React 已经有一段时间了，现在决定仔细研究一下我正在做的一个新项目的 Redux。

起初我的印象是所有用户活动都应该导致动作，主要原因之一是您可以通过回放适当的动作来重建任何应用程序状态。

然而，这样做的问题是，您在商店中放置了很多实际上感觉不像是应用程序状态的东西。像“如果我专注于这个输入，标签会变成绿色”这样的东西似乎并不适合在可能由数百个组件组成的应用程序的应用程序状态中表示。这些事情对于典型的 todo-tutorial 来说是完全有意义的，但很难看出它在更复杂的场景中会变成什么样子。

然后我又读了一些，发现创建者 Dan Abramov 支持的一般意见是，您通常应该将本地组件状态与应用程序状态（存储）结合起来。 “任何看起来最不尴尬的”似乎是存储状态的经验法则。

一方面，这是完全有道理的：真正属于应用程序状态并且与多个组件相关的东西应该在 store 中，而只涉及单个组件的严格呈现细节应该使用正常的反应状态来处理。另一方面，这种方法让我有点困惑，因为我在一开始写的：Redux 的重点不是避免在组件之间分布状态，并且能够重新创建状态只存储动作？

我希望有人能对这个问题有所了解，因为它一直困扰着我，我认为在尝试使用 redux 构建复杂的东西之前，我应该得到一个可靠的意见。

Answer 1

你把什么状态放在哪里完全取决于你。有时将所有内容放在 Redux 中可能有意义，有时将内容保存在组件中可能有意义。我最近看到了一些很好的经验法则：

• 应用程序的其他部分是否关心这些数据？
• 您是否需要能够从该数据中获取更多数据？
• 是否使用相同的数据来驱动多个组件/功能？
• 能够将状态恢复到给定时间点（即：时间旅行/调试）对您有价值吗？
• 是否要缓存数据，即：如果数据已经存在，则从状态重新加载，而不是再次请求？

（该列表归功于https://www.reddit.com/r/reactjs/comments/4w04to/when_using_redux_should_all_asynchronous_actions/d63u4o8。）

另请参阅有关此主题的 Redux 常见问题解答：http://redux.js.org/docs/FAQ.html#organizing-state-only-redux-state。