React Redux 中 Action 和Reducer 是如何相互连接的

Question

我是反应和还原的新手。我已经浏览了很多关于 React Redux 的在线教程，但仍然无法理解 Action 和Reducer 是如何连接的。如果我是对的，我们在容器/组件中导入操作，在创建存储的文件中导入减速器。所以容器-action之间有联系，reducer和store之间也有联系，但在action文件中我们不导入reducer。那么action是如何连接到reducer的。我知道我们有一种类型的操作，将在减速器的开关盒中进行检查。但它是如何传递给reducer的呢？

Answer 1

非常高层次的概述

动作- 动作可以更新状态

{ type: ACTION_TYPE, somePayload: payload }

redux 存储公开了一个dispatch函数，该函数最终包装了一个动作创建者。

mapDispatchToProps = dispatch => {
  return {
    someWrappedAction: () => dispatch(actionCreatorFn()),
    someOtherWrappedAction: val => dispatch(otherActionCreatorFn(val)),
  }
}

useDispatchHook 返回，dispatch然后你自己包装动作

const dispatch = useDispatch()

<button onClick={() => dispatch(someActionCreatorFn())}>
  Do Action
</button>

减速器

减速器形成状态树，从传递到 redux 存储的根减速器开始。“连接”（按照惯例）是通过 HOC 建立mapDispatchToProps的connect。（现在可以从钩子中获取dispatchuseDispatch）

减速器是纯函数，它接受两个参数：当前状态和操作，并返回下一个状态。

(currentState, action) => nextState

那么mapDispatchToProps中的每个dispatch是如何连接到适当的reducer的......

当您分派操作创建者时，它将操作对象传递给根减速器。操作对象通过整个状态树传递，并且处理该操作的任何减速器都会type消耗它。