我正在使用React Flux . 我们的团队正计划从通量转向redux . Redux对于来自flux world的我来说非常困惑 . 在 flux control flow is 简单来自 Components -> actions -> Store and store updates back components . 它简单而且非常清晰 .
但在redux中它令人困惑 . 这里没有商店,是的,有些例子没有使用商店 . 我经历了几个教程,似乎每个人都有自己的实现风格 . 有些人正在使用容器,有些人则没有 . (我不知道这个容器概念,也无法理解mapStatepoProps所做的mapStateToProps) .
-
有人可以清楚地解释如何在redux中控制流程吗?
-
redux中组件/容器/操作/操作创建者/存储的角色是什么?
-
redux / react-redux / redux-thunk / any others之间的差异?
-
如果您可以发布任何 simple and precise redux教程的链接,将会非常有帮助 .
3 回答
每当要替换商店中的状态时,都会调度操作 .
该动作由一个或多个减速器捕获 .
reducer / s创建一个新状态,它结合了旧状态和分派的动作 .
商店订户被通知存在新状态 .
Store - 保持状态,当新动作到达时,运行dispatch - > middleware - > reducers管道,并在状态被新的状态替换时通知订户 .
组件 - 直接无法识别状态的哑视图部件 . 也被称为表达组件 .
容器 - 使用react-redux了解状态的视图片段 . 也称为智能组件和更高阶组件
请注意,容器/智能组件与哑组件只是构建应用程序的好方法 .
动作 - 与flux相同 - 具有类型和有效负载的命令模式 .
动作创建者 - DRY创建动作的方式(非必要)
redux - 与单个商店流动的流量,可以在任何你喜欢的环境中使用,包括香草js,反应,角1/2等等......
react-redux - redux和react之间的绑定,创建监听商店状态变化的容器(智能组件),为演示(哑)组件准备道具并重新渲染 .
redux-thunk - 允许您编写返回函数而不是动作的动作创建者的中间件 . thunk可用于延迟动作的发送,或仅在满足某个条件时发送 . 主要用于对api的异步调用,即在成功/失败时调度另一个操作 .
Redux official docs
Getting Started with Redux
Building React Applications with Idiomatic Redux
Presentational and Container Components
要回答你的 Headers 问题:
redux:主库(独立于React)
redux-thunk:一个redux中间件,可以帮助您进行异步操作
react-redux:将您的redux商店与ReactComponents连接起来
redux:用于管理应用程序状态的库 .
react-redux:用于管理 React 应用程序状态的库 .
redux-thunk:用于记录,崩溃报告,与asyn API通信,路由等的中间件......