什么是 Redux-thunk？
Redux-thunk 是一个中间件，它允许我们在 Redux 应用中编写异步逻辑。它的主要作用就是将 action 创建函数返回一个函数，而不是一个 action 对象。这个函数可以在需要的时候再执行，这样我们就可以在函数中完成异步操作，最终再触发一个 action。
Redux-thunk 的使用方法
在使用 Redux-thunk 之前，我们需要先安装它。可以使用 npm 或 yarn 进行安装：
npm install redux-thunk // or yarn add redux-thunk
安装完成后，我们需要在创建 store 的时候将 thunk 中间件进行注册：
import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import rootReducer from './reducers';
const store = createStore(rootReducer, applyMiddleware(thunk));在注册中间件后，我们就可以开始编写异步逻辑了。我们可以在 action 创建函数中返回一个函数，这个函数可以接收 dispatch 和 getState 两个参数，其中 dispatch 用于触发 action，getState 用于获取当前 state。
-- -------------------- ---- -------
----- ---------- - -- -- -
------ ---------- --------- -- -
---------- ----- --------------------- ---
-------------------
-------------- -- ----------------
----------- -- -
----------
----- ----------------------
-------- -----
---
--
------------ -- -
----------
----- ----------------------
-------- -------------
---
---
--
--在上面的例子中，我们首先触发了一个 FETCH_POSTS_REQUEST 的 action，然后使用 fetch 函数获取数据，最后根据请求结果触发 FETCH_POSTS_SUCCESS 或 FETCH_POSTS_FAILURE 的 action。
Redux-thunk 的学习意义
Redux-thunk 的使用可以帮助我们更好地管理 Redux 应用中的异步逻辑。在 Redux 中，所有的 state 变化都必须通过触发 action 来完成。而在实际开发中，我们经常需要进行异步操作，例如从服务器获取数据，这时候 Redux-thunk 就可以派上用场了。
使用 Redux-thunk 可以让我们的代码更加简洁和易于维护。通过将异步逻辑封装在 action 创建函数中，我们可以将业务逻辑和异步逻辑分离，使代码更加清晰。此外，Redux-thunk 还支持异步操作的取消和重试，这为我们的开发带来了很大的便利。
Redux-thunk 的指导意义
在使用 Redux-thunk 的时候，我们需要注意以下几点：
- 在 action 创建函数中返回一个函数，而不是一个 action 对象。
- 在返回的函数中执行异步操作，并在异步操作完成后触发一个 action。
- 在编写异步操作时，需要使用 fetch 或 axios 等库进行网络请求。
- 在编写异步操作时，需要注意错误处理和异常情况的处理。
示例代码
下面是一个简单的 Redux-thunk 示例：
-- -------------------- ---- -------
------ - ------------ --------------- - ---- --------
------ ----- ---- --------------
------ ----------- ---- -------------
----- ----- - ------------------------ ------------------------
----- ---------- - -- -- -
------ ---------- --------- -- -
---------- ----- --------------------- ---
-------------------
-------------- -- ----------------
----------- -- -
----------
----- ----------------------
-------- -----
---
--
------------ -- -
----------
----- ----------------------
-------- -------------
---
---
--
--
-----------------------------在上面的例子中，我们首先创建了一个 store，并注册了 Redux-thunk 中间件。然后我们定义了一个 fetchPosts 的 action 创建函数，这个函数返回一个函数，在这个函数中我们使用 fetch 函数获取数据，并根据请求结果触发 FETCH_POSTS_SUCCESS 或 FETCH_POSTS_FAILURE 的 action。最后我们使用 store.dispatch 触发了这个 action。
Source: FunTeaLearn,Please indicate the source for reprints https://funteas.com/post/67d2d4d2a941bf7134583d1a