Redux中派发Logout Action报错「Actions must be plain objects」的解决方法

这个问题我太熟了，一眼就能看出问题所在——你直接把logout函数传给了dispatch，但Redux的dispatch只接受纯对象格式的action。你定义的logout是一个生成action对象的函数，而非action本身，直接传函数自然会触发这个错误。

简单修复方案 #

只需要把store.dispatch(logout)改成store.dispatch(logout())就可以解决。调用logout()会执行这个函数，返回你定义的{ type: LOGOUT }纯对象action，这才是dispatch能正确处理的格式。

修改后的request函数catch块代码如下：

.catch(err => {
  console.log(err);
  if (err.response.status === 401) {
    // 调用logout函数获取action对象再派发
    store.dispatch(logout());
  }
  throw err;
});

额外补充 #

如果之后你的登出逻辑需要处理异步操作（比如调用后端的登出API），那你就得引入Redux Thunk这类中间件来支持派发函数格式的action。但就目前你的代码而言，logout只是同步生成action的函数，只要调用它拿到返回的对象再dispatch就完全没问题了。

内容的提问来源于stack exchange，提问作者Igor Shmukler