redux和react-redux
程序员文章站
2022-07-01 08:38:42
redux和react redux的关系: redux是react的状态管理工具,却不仅仅只是为了react而生的,所以在使用中会存在痛点。而react redux是专门为了react定制,目的是为了解决redux的痛点,起到了补充的作用。 redux和flux思想: 从代码层面而言,flux无非就 ......
redux和react-redux的关系:
redux是react的状态管理工具,却不仅仅只是为了react而生的,所以在使用中会存在痛点。而react-redux是专门为了react定制,目的是为了解决redux的痛点,起到了补充的作用。
redux和flux思想:
从代码层面而言,flux无非就是一个常见的event dispatcher,其目的是要将以往mvc中各个view组件内的controller代码片断提取出来放到更加恰当的地方进行集中化管理,并从开发体验上实现了舒适清爽、容易驾驭的“单向流”模式。
但为了区分于以往的mvc模式,并向facebook的贡献表达敬意,后面我们将把这种优化后的 model-view-controller 开发模式在react背景下正式称为flux模式。
redux 的核心概念:
- 在顶层组件创建一个store(状态实例),底层组件通过props共享这个store。
- 数据流动的方向:
component->action->reducer->state->component
component: 展示结果(含处理结果代码)
action: 转发的动作,异步请求,
reducer: 业务处理逻辑,copy+更新 + 返回(return)新state
state: 状态收集,更新内部state状态,更新订阅(store.subscribe)state的组件(component) - 更改state:
component-->dispatch(action)-->reducer -
获取state:
store.getstate() 抓state状态---只能抓取一次
store.subscribe() 订阅---state更新会触发---首次不更新不触发,导致影响首次渲染两种方法可以结合使用