zoukankan      html  css  js  c++  java
  • Redux的State不应该全部放在Store里

    使用了redux管理应用的状态,应用的状态不应该全部放在Store里面。

    前端状态主要有一下两种:

    1. Domain data

    2. UI State


    1. Domain data

    来自于服务端对领域模型的抽象,比如user,product,这个应该放在Store,方便更新data

    2. UI State

    大部分的UI State不应该放在Store中,应该使用组件私有state。

    1. UI层面的toggle状态

    主要包括 组件的显示隐藏,按钮的disable,列表的折叠展开等

    2. 表单中的input的state

    3. 组件中的动画相关的状态,例如坐标值


    总之,Redux中的State遵循以下原则:

    1. 怎么不笨拙,就怎么做
    2. 需要全局共享的状态,才需要放在Store中,不影响app全局的短暂状态,放在组件内部
    3. 一个组件内部的状态,频繁修改,若放在store中,则会频繁更新store,由此产生的state的快照也没有意义
    4. 控件的state不会对任何其他控件产生影响,也不依赖store中的state时,就应该锁在控件内,不要放出了污染Store
    5. 常见的一些频繁更新的状态,组件的style的height属性,应该作为私有状态,挂在eventlistener上来动态更新,
    form表单中的input的state,应该是私有状态,不应该放在Store中,输入一个‘hello world’,产生11个state快照
    显然没有意义,还会影响性能,不迷信一些开源组件,例如 redux-form 的做法
    6. 私有的UI State放在Store,使用action进行切换,会增加额外的代码量,不会产生任何收益 

    参考:https://segmentfault.com/a/1190000009540007
         https://www.jianshu.com/p/b53204339730
         http://react-china.org/t/redux/8436
         https://blog.csdn.net/a986597353/article/details/78646301

  • 相关阅读:
    1028 人口普查 (20分)
    1027 打印沙漏 (20分)
    1026 程序运行时间 (15分)
    1025 反转链表 (25分)
    1024 科学计数法 (20分)
    1023 组个最小数 (20分)
    1022 D进制的A+B (20分)
    1021 个位数统计 (15分)
    1020 月饼 (25分)
    1019 数字黑洞 (20分)
  • 原文地址:https://www.cnblogs.com/mengff/p/9758012.html
Copyright © 2011-2022 走看看