无法从 React 应用程序中的快速服务器访问响应数据

Question

在我的 React 应用程序中，我试图访问从这段服务器代码返回的错误。

  User.findByUsername(req.body.username)
    .then((foundUsername) => {
      if (foundUsername) {
        return res.status(422)
          .json({
            error: 'This username is not available.'
          });
      }

这是客户端的动作创建者

export const signupUser = ({ displayName, email, password, username }) => {
  return (dispatch) => {
    axios.post(`${API_URL}/signup`, { displayName, email, password, username })
      .then((res) => {
        dispatch({ type: AUTH_USER });
        localStorage.setItem('token', res.data.token);
        browserHistory.push('/');
      })
      .catch((res) => {
        console.log(res.data.error);
      });
  };
};

我似乎想不通的是，我可以在我的then 案例中访问res.data.token，但在我的catch 案例中无法获取res.data.error，即使我可以看到响应通过在 chrome 的网络标签中。

如果我在catch 案例中将res 登录到控制台，这就是我得到的结果

错误：请求失败，状态码 422 在 createError (eval at 150 (bundle.e3597bf….js:39), :15:15) 结算时（eval at 258 (bundle.e3597bf….js:125), :18:12） 在 XMLHttpRequest.handleLoad (eval at 147 (bundle.e3597bf….js:7), :77:7)

在then 中记录res 给了我想要的对象。任何帮助将不胜感激。

Answer 1

res 对象中有两个键。

config 和 response

您要查找的错误消息在res.response.data.error