Redux报错：Actions必须是纯对象，该如何解决？

错误根源 #

你遇到的报错是因为在AuthAction.js的signUp异步action里，最后有一行多余的dispatch();代码——这里没有传入任何action对象，导致Redux尝试分发undefined，违反了Redux必须分发纯对象action的规则。而数据能成功保存到Firebase，是因为这行代码在所有Firebase操作完成后才执行，不影响之前的异步逻辑。

修复步骤 #

直接删除AuthAction.js中signUp函数里的dispatch();这一行即可。

修改后的signUp函数代码：

export const signUp = (username, email, password) => {
  return async (dispatch) => {
    const app = getFirebaseApp();
    const auth = getAuth(app);
    try {
      const result = await createUserWithEmailAndPassword(
        auth,
        email,
        password
      );
      const { uid, stsTokenManager } = result.user;
      const { accessToken, expirationTime } = stsTokenManager;
      const expiryDate = new Date(expirationTime);
      const userData = await createUser(username, email, uid);
      dispatch(authenticate({ token: accessToken, userData }));
      saveToDataStorage(accessToken, uid, expiryDate);
      // 移除下面这行多余的dispatch调用
      // dispatch();
    } catch (error) {
      console.log(error);
      const errorCode = error.code;
      let msg = "Something went wrong";
      if (
        errorCode === "auth/wrong-password" ||
        errorCode === "auth/user-not-found"
      ) {
        msg = "Invalid email or password";
      }
      throw new Error(msg);
    }
  };
};

额外说明 #

你的Store配置是正确的：@reduxjs/toolkit的configureStore已经默认集成了redux-thunk中间件，所以不需要额外配置就能处理异步action，这也是你的异步逻辑能成功执行的原因。

内容的提问来源于stack exchange，提问作者Amit Deka