咨询redux-thunk返回函数的调用位置（附addUser代码示例）

你写的addUser是一个Redux Thunk异步action创建函数，它返回的那个带dispatch参数的函数，是由Redux Thunk中间件自动调用的，具体流程如下：

• 第一步：你在React组件（或其他逻辑代码里）调用dispatch(addUser(用户数据))，此时addUser(用户数据)会先执行，返回那个包含axios请求的函数。
• 第二步：Redux的Thunk中间件会拦截到这个返回的函数（因为它不是普通的纯对象action），然后自动调用这个函数，并且把Redux的dispatch方法（还有可选的getState方法）作为参数传进去。
• 第三步：这个被调用的函数里会执行axios的POST请求，请求成功后再通过传入的dispatch触发userAdded和loadUsers这两个同步action。

给你举个组件里的调用示例，帮你更直观理解：

import { useDispatch } from 'react-redux';
import { addUser } from './your-action-file';

function AddUserForm() {
  const dispatch = useDispatch();

  const handleSaveUser = (newUser) => {
    // 这里触发dispatch，Thunk中间件会处理addUser返回的函数
    dispatch(addUser(newUser));
  };

  // ...表单渲染和用户输入处理逻辑
}

总结：你不需要手动调用这个返回的函数，Thunk中间件会在你dispatch这个异步action创建函数的返回值时，自动帮你调用它。

内容的提问来源于stack exchange，提问作者hope.consistency