React Redux异步Action报错：Actions must be plain objects及日志未输出问题

这个问题其实很常见——Redux 默认只能处理普通对象类型的同步 Action，而你写的 login 函数返回的是一个接收 dispatch 的函数（也就是异步 Action），Redux 本身不知道怎么处理这种函数，所以直接抛出了错误，而且因为这个函数根本没被执行，你的 console.log("LOGIN DISPATCHER") 自然也不会打印。

解决步骤： #

1. 安装 redux-thunk 中间件

redux-thunk 是 Redux 官方推荐的处理异步 Action 的中间件，它允许你的 Action Creator 返回函数而不是普通对象。

执行安装命令：

npm install redux-thunk
# 或者用 yarn
yarn add redux-thunk

2. 在创建 Redux Store 时应用中间件

你需要在创建 Store 的时候，通过 applyMiddleware 把 redux-thunk 加进去，这样 Redux 就能识别并执行你返回的函数式 Action 了。

比如你的 Store 创建代码应该类似这样：

import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
// 导入你的根 reducer
import rootReducer from './path/to/your/rootReducer';

// 创建 Store 并应用 thunk 中间件
const store = createStore(
  rootReducer,
  applyMiddleware(thunk) // 关键：添加这一行
);

export default store;

如果你使用的是 Redux Toolkit（现在更推荐的写法），configureStore 已经默认集成了 redux-thunk，所以不需要额外配置，直接使用即可：

import { configureStore } from '@reduxjs/toolkit';
import rootReducer from './path/to/your/rootReducer';

const store = configureStore({
  reducer: rootReducer,
});

export default store;

3. 确认你的 Action 写法没问题

你的 login Action Creator 写法本身是符合 thunk 规范的，返回的函数接收 dispatch，在异步请求完成后分发同步 Action（setCurrentUser），这部分不需要修改。

为什么之前的 console.log 没执行？ #

因为 Redux 在没有 thunk 中间件的情况下，会直接把你返回的函数当作一个普通 Action 对象来校验，发现它不是 plain object 就立刻抛出错误，根本不会去执行这个函数里面的逻辑，所以你的日志自然打不出来。

添加完 thunk 中间件后，Redux 会自动调用这个返回的函数，并把 dispatch 作为参数传进去，这时你的 console.log 就能正常打印，异步请求也能正常执行了。

内容的提问来源于stack exchange，提问作者Arman Feyzi