码迷,mamicode.com
首页 > 其他好文 > 详细

redux和react-redux

时间:2019-09-13 01:04:59      阅读:86      评论:0      收藏:0      [点我收藏+]

标签:集中   背景   book   方向   开发模式   结合   使用   store   表达   

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更新会触发---首次不更新不触发,导致影响首次渲染

      两种方法可以结合使用

redux和react-redux

标签:集中   背景   book   方向   开发模式   结合   使用   store   表达   

原文地址:https://www.cnblogs.com/twizcl/p/11515552.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!