Redux的使用详解（二）
王红元coderwhy
目录1认识ReduxToolkit
content
2ReduxToolkit重构
3ReduxToolkit异步
4connect高阶组件
5中间件的实现原理
6React状态管理选择
coderwhy认识ReduxToolkit
?ReduxToolkit是官方推荐的编写Redux逻辑的方法。
?在前面我们学习Redux的时候应该已经发现，redux的编写逻辑过于的繁琐和麻烦。
?并且代码通常分拆在多个文件中（虽然也可以放到一个文件管理，但是代码量过多，不利于管理）；
?ReduxToolkit包旨在成为编写Redux逻辑的标准方式，从而解决上面提到的问题；
?在很多地方为了称呼方便，也将之称为“RTK”；
?安装ReduxToolkit：
npminstall@reduxjs/toolkitreact-redux
?ReduxToolkit的核心API主要是如下几个：
?configureStore：包装createStore以提供简化的配置选项和良好的默认值。它可以自动组合你的slicereducer，添加你提供
的任何Redux中间件，redux-thunk默认包含，并启用ReduxDevToolsExtension。
?createSlice：接受reducer函数的对象、切片名称和初始状态值，并自动生成切片reducer，并带有相应的actions。
?createAsyncThunk:接受一个动作类型字符串和一个返回承诺的函数，并生成一个pending/fulfilled/rejected基于该承诺分
派动作类型的thunk
coderwhy重构代码–创建counter的reducer
?我们先对counter的reducer进行重构：通过createSlice创建一个slice。
?createSlice主要包含如下几个参数：
?name：用户标记slice的名词
?在之后的redux-devtool中会显示对应的名词；
?initialState：初始化值
?第一次初始化时的值；
?reducers：相当于之前的reducer函数
?对象类型，并且可以添加很多的函数；
?函数类似于redux原来reducer中的一个case语句；
?函数的参数：
?参数一：state
?参数二：调用这个action时，传递的action参数；
?createSlice返回值是一个对象，包含所有的actions；
coderwhy重构代码–创建home的reducer
coderwhystore的创建
?configureStore用于创建store对象，常见参数如下：
?reducer，将slice中的reducer可以组成一个对象传入此处；
?middleware：可以使用参数，传入其他的中间件（自行了解）；
?devTools：是否配置devTools工具，默认为true；
coderwhyReduxToolkit的异步操作
?在之前的开发中，我们通过redux-thunk中间件让dispatch中可以进行异步操作。
?ReduxToolkit默认已经给我们继承了Thunk相关的功能：createAsyncThunk
?当createAsyncThunk创建出来的action被dispatch时，会存在三种状态：
?pending：action被发出，但是还没有最