在react和redux中处理本地状态

时间:2015-11-18 20:08:38

标签: reactjs redux

当使用与redux一起使用时,是否可以将本地状态存储在state对象中?通过操作将所有内容存储在状态树中很快就会变得单调乏味。感觉某些状态仅与应用程序的显示/显示相关,而不是逻辑。通过演示我的意思是动画/闪烁,面板的扩展/收缩状态,表格中的排序标准等。

3 个答案:

答案 0 :(得分:14)

这很难回答,因为不同的人会将组件的不同部分归类为“状态”。

由于Redux关注应用程序状态,根据经验,任何您希望应用程序级别“撤消/重做”按钮生效的内容都应该作为Redux Action发生。事实上Redux有一个撤销存储插件是因为应用程序状态的可及性。

当然,有些动画不可撤销,因为这些动画应该真正与应用状态的变化相关联,而不是自身的变化。但是,其余的示例听起来非常像应用状态。如果我对一个表进行排序,然后按下撤消,我绝对希望撤消排序。

答案 1 :(得分:7)

现在在redux FAQs

中回答了这个问题
  

对此没有“正确”的答案。有些用户更喜欢在Redux中保留每一段数据,以便始终保持其应用程序的完全可序列化和受控版本。其他人更喜欢在组件的内部状态内保持非关键或UI状态,例如“此下拉列表当前是否打开”。

     

使用本地组件状态很好。作为开发人员,您的工作是确定应用程序的状态,以及每个州应该居住的位置。找到适合您的天平,并随身携带。

答案 2 :(得分:5)

正如Tyrsius已经提到的那样 - 对此有不同的看法。

对于我们 - 作为经验法则 - 我们确保跟踪应用程序状态的所有内容,如果我们远程连接到某些用户的当前会话,我们希望能够看到它。

如果我们不关心鼠标是否悬停在某个元素上,我们可能只会使用组件状态(如果我们需要状态那么)。

我们的脚本中只有少数这样的情况,因为我们想知道用户在大多数情况下看到的确切内容以便于调试。

您提到了面板的扩展/折叠状态 - 我们有时会为我们创建处理这种扩展/折叠逻辑的组件,因此我们不必为我们创建的每个面板始终编写这样的缩减器。

我们可以使用这样的组件:

<Panel id="somePanelId">some content</Panel>

面板组件将确保在应用程序状态中跟踪面板活动状态。通过这种方式,保持代码简单并且不会让它爆炸真的很容易。