【问题标题】：How to Handle UI State in Redux/React - Redux-UI?如何在 Redux/React 中处理 UI 状态 - Redux-UI？
【发布时间】：2018-08-02 04:39:29
【问题描述】：
我正在研究存储 UI 状态的最佳方法是什么，我应该使用 Redux-UI (https://github.com/tonyhb/redux-ui) 之类的东西来存储/管理 UI 状态吗？还是应该为 UI 创建自己的操作/reducer？
还有...
当我存储了 UI 状态后，如何确保浏览器刷新后，我仍然拥有与页面完全相同的状态？就像普通网页会包含从服务器获取的数据一样。
我安装了带有 thunk middle wear 的 Redux 和一个商店。到目前为止，我在过去的几个月里一直在使用 React。
谢谢！
昆顿
【问题讨论】：
标签：
javascript
reactjs
state
state-management
【解决方案1】：
我们的团队为此花费了几天时间。我们想要 UI 状态而不是将这些状态放入 Redux 的状态树的原因可能是：
这些 UI 状态仅与极少数组件相关。但有时我们需要在它们之间共享这些状态。例如，一个 Button 来控制一个 Modal，它们都需要读/写 'isModalOpen' 状态。
这些状态不是数据，它们是 UI 首选项，可以在卸载组件时将它们重置为默认值。将它们持久化在单个 Redux 存储中听起来像是污染了状态树。
我们试过了：
- 仅为 UI 创建单独的 redux 状态树。
- 为所有“UI”状态添加一个主分支，例如“state.UI”。
但是，所有这些都涉及必须使用/实现自定义中间件、操作和减速器。很难。
最后，我发了react-provide-state。它真的很好用。它的唯一缺点是您无法在浏览器控制台中轻松查看像 Redux 树中的状态那样的 ui 状态。而且您只能通过 UI（用户操作事件回调）更新状态。这很公平，我们正在谈论的是 UI 状态。