redux，react-redux，redux-thunk有什么区别？

Question

我正在使用React + Flux。我们的团队正计划从flux迁移到redux。来自flux世界的Redux让我非常困惑。在中，流量控制流程很简单，来自Components -> actions -> Store store updates back components。这很简单，也很清楚。

但在redux中它是令人困惑的。这里没有store，是的，有一些没有使用store的例子。我看了几个教程，似乎每个人都有自己的实现风格。有些人在使用容器，有些人没有。(我不知道这个容器的概念，也不能理解mapStateToProps、mapDispatchToProps是做什么的)。

1. 有人能清楚地解释一下redux中的控制流是如何发生的吗？
2. redux中的组件/容器/操作/操作创建者/存储区的角色是什么？
3. redux /react-redux/redux-thunk/任何其他内容之间的区别?？
4. 如果您可以发布任何简单而精确的<代码>E213redux教程的链接，将非常有帮助。<代码>H214<代码>G215

Answer 1

1. 有人能清楚地解释一下redux中的控制流是如何发生的吗?

Redux (总是)只有一个商店。

1. 每当您想要替换存储中的状态时，您都会分派一个操作。

1. 操作被一个或多个减速器捕获。

1. reducer/s创建一个结合了旧状态和调度的操作的新状态。

1. 商店订阅者收到新状态的通知。

1. redux中组件/容器/操作/操作创建者/存储的角色是什么?

• Store -保存状态，当新操作到达时，运行调度->中间件-> reducers管道，并在状态被新状态替换时通知订阅者。

• Components -不能直接感知状态的哑视图部件。也称为表现性组件。

react

• Containers-使用react-redux感知状态的视图片段。也称为智能组件和高阶组件

请注意，容器/智能组件与哑巴组件只是一个很好的构建应用程序结构的方法。

• 操作-与flux相同-具有类型和有效负载的命令模式。

• 操作创建者-创建操作的干式方法(不是绝对必要的)

1. redux/react-redux/redux-thunk/any others ?

• redux -具有单一存储的类似flux的流，可以在任何您喜欢的环境中使用，包括vanilla js、react、angular 1/2等...

• react-redux - redux和react之间的绑定。该库提供了一组react hooks - useSelector()，以及用于从存储中获取数据的useStore()和用于分派操作的useDispatch()。您还可以使用connect()函数来创建HoC(高阶组件)，它们监听存储的状态更改，为包装的组件准备道具，并在状态更改时重新呈现包装的组件。

• redux-thunk -允许您编写返回函数而不是操作的操作创建器的中间件。thunk可用于延迟操作的调度，或者仅在满足特定条件时才调度。主要用于对api的异步调用，在成功/失败时调度另一个操作。

1. 如果您可以发布任何简单而精确的redux教程的链接，这将非常有帮助。

• Redux official docs

• Getting Started with Redux

• Building React Applications with Idiomatic Redux

• Presentational and Container Components

Answer 2

回答你的标题问题：

redux，react-redux，redux-thunk有什么区别？

1. redux : main library (独立于React)
2. redux - actions
3. react-redux：：一个帮助您使用异步redux连接redux商店与React的redux中间件

Answer 3

redux:用于管理应用程序的库state.

• react-redux:用于管理React应用程序的库(redux)用于记录日志、崩溃报告、与异步

• 对话、路由等的中间件...