koo*_*hik
5
你的问题没有一个真实的答案.
你有不同类型的州.您具有模型状态(根据MVC)和UI(视图)状态.在经典MVC中,您的模型不应该依赖于UI.所以,这里有一个问题:在全局redux存储中保存UI状态(输入,复选框状态)是否可以.
在这种情况下,最一般的规则是使用常识:).您可以根据自己的需要选择任何一种方法,如果它更适合您的情况就可以.
但是,让我们看几个例子.
全球redux商店的一切
我知道应用程序,可以在全球redux商店中保存整个UI状态.我的意思是任何字段中的每次击键都会触发事件并更新全局存储.
优点:
- 当整个州处于一个地方时,很容易跟踪状态变化.
- 您可以序列化整个状态以进行调试.它可以自动保存错误状态.或者QA工程师可以使用特殊的键盘快捷方式转储UI状态并发送给开发人员.开发人员可以采用此序列化状态并恢复QA计算机上的整个UI.
缺点:
- 每次按键都会重新呈现整个应用程序.
- 只有在用户输入一些数据时才需要很多中间状态(在全局存储中).
- 将状态传递给组件.您将使用"容器"组件,但问题是您的"容器"组件应该只是顶级组件,还是应该将叶转储组件包装在容器中.两种变体都是可以接受的,但在大多数情况下,最好将状态移动得更高(这是有意义的).阅读"Smart vs Dumb"组件或"Containers vs Presentational组件"
- 您应该在一个全局存储中管理不同类型的状态(来自不同的源).
组件中的UI状态.
例如,您有一个表单.并且您的表单通过自己的方式管理您输入的状态.所以你只需渲染它<Form onSubmit={ (fields) => saveFields(fields) }>
优点:
- 中间形式状态是私有形式.你可以认为这个状态根本不存在,对你没关系.
- 私人国家的形状更容易改变.
- 组件更加连贯.它们更加独立,就像大型应用程序中的简单迷你应用程序一样.
缺点:
- 其他组件无法访问此状态.
- 没有一个存储状态的地方.
- 国家管理的不同方法.
- 当存在多个thruth源时,增加了可能性.
其他资源:
一些有用的一般性想法:
- 在组件中处理尽可能少的状态但不低于要求.无状态组件更易于使用.但请记住,状态将被移动到某个地方,因此您无论如何都需要处理它(它可以是存储或表示包装组件等).
- 使您的组件尽可能独立.您可以使用私有状态创建良好的独立组件或使其成为无状态.
- 将组件拆分为表示组件(与上下文无关)和容器组件(依赖于上下文).
- 尽可能高地移动状态.更喜欢在上层组件中保存状态.它不仅可以是容器组件.您可以创建包含无状态组件的表示组件,以便管理状态(它们与redux没有连接)