React，用来构建用户界面，它有三个特点：
- 作为view，构建上用户界面
- 虚拟DOM，目的就是高性能DOM渲染【diff算法】、组件化、多端同构
- 单向数据流，是一种自上而下的渲染方式。
Flux
在一个React应用中，UI部分是由无数个组件嵌套构成的，组件和组件之间就存在层级关系，也就是父组件、子组件以及顶层组件。
当我们获取到数据后，根据React自上而下的渲染方式，我们把数据传给顶层组件，由顶层组件通过属性props，将数据传给各个子组件，这样数据就一层一层传递下去，各个子组件获取自己所需的数据，最终完成UI的渲染。
当有一个数据发生了变化后，是如何通知组件更新呢？思路如下：
- 定义一个数据存储store，它存储的是应用的当前的状态state；
- 用户操作导致数据变更的时候，就会触发一个action，告知store有数据变化了，以及哪些数据发生变化；
- store接收到通知后，就更新修改数据，返回新的数据传递到顶层组件。再进行一次自上而下的渲染，从而达到更新UI。
Flux是一种数据处理的模式，描述的是单向数据流的思想。让数据流变得简单，方便调试和追踪，所以它更适合与react结合使用。
Flux中，引入的dispatch、action、store和view模块，触发action时，需要使用dispatch来调度
Redux
Redux是FLux的一种实现形式，保留了数据流的单向性，除了flux原本的几个模块，还添加了reducers和middlewares。
store
store，作为一个数据存储中心，连接action和组件【view】。它接收组件传来的action，然后根据action.type和action.payload来对store中的数据进行更新。最后store通知组件有数据变化。组件就获取最先的数据，来完成重新新渲染。
reducer修改数据后，在组件中调用subscribe方法，subscribe传入一个回调函数。在每次调用dispatch时，subscribe传入的回调函数被触发，这样就完成了reducer修改数据后，通知组件获取最新数据，实现组件重新渲染。
小总结一下：
- store中数据的修改，是通过reducer来完成的，调用dispatch(action)，action->reducers->store
- store提供了消息发布和订阅功能，来实现连接action和组件，dispatch触发消息发布，subscribe触发消息订阅。
Reducer
reducer是一个纯函数，用来修改store数据的。它有优势：数据拆解。
redux有一个原则，就是单一的数据源，整个应用，只有一个store，存储着所有的数据。如果一个应用存在多个应用的话，并且store之间存在数据关联关系，那么处理起来比较麻烦。
单一数据源，也有一个问题，那就是数据结构嵌套太深，导致数据访问繁琐。
所redux提出通过定义多个reducer对数据进行访问和修改，最后通过combineReducers函数，来组合所有的数据。比如：
import { combineReducers } from "redux";
import menuReducer from "./menu";
const reducers = combineReducers({
menus: menuReducer,
});
export default reducers
这就是redux的数据拆解。
Middleware
Middleware是中间件，Middleware处理对象是action，通过对action的type属性进行判断，采取不同的操作。
React-redux
为了让redux和react更好的结合，就需要引入React-redux，它提供了两个API：Provider和connect
Provider
Provider组件作用就是把唯一的数据源store传给任意组件。
connect
connect作用就是让组件和store进行关联。需要定义两个函数mapStateToProps和mapDispatchToProps，如果不想使用connect的话，也可以通过useSelector,useDispatch，也就是React-redux对应的hooksAPI，来完成组件和store关联。