未捕获(承诺)TypeError:无法读取未定义的React / Redux / Axios的属性“数据”

时间:2019-09-06 01:32:04

标签: javascript axios

调用所涉及的操作(postRequest)时,它将返回此数据未定义的错误,但是该操作成功并且刷新清除了该错误。

错误:

Uncaught (in promise) TypeError: Cannot read property 'data' of undefined:
        payload: err.response.data

前端:

 handleSubmit = event => {
    event.preventDefault();
    this.props.postRequest({ body: this.state.body });
  };
export const postRequest = newRequest => dispatch => {
  dispatch({ type: LOADING_UI });
  axios
    .post('/request', newRequest)
    .then(res => {
      dispatch({
        type: POST_REQUEST,
        payload: res.data
      });
      dispatch(clearErrors());
    })
    .catch(err => {
      dispatch({
        type: SET_ERRORS,
        payload: err.response.data
      });
    });
};

后端:

exports.newRequest = (req, res) => {
  if (req.body.body.trim() === "") {
    return res.status(400).json({ body: "Body must not be empty" });
  }

  db.collection("requests")
    .where("userHandle", "==", req.user.handle)
    .where("status", "==", "awaiting")
    .limit(1)
    .get()
    .then(data => {
      if (!data.empty) {
        return res
          .status(403)
          .json({ general: `Only 1 outstanding request at a time` });
      }
      return db
        .collection("requests")
        .add(newRequest)
        .then(doc => {
          const resRequest = newRequest;
          resRequest.requestId = doc.id;
          res.json({ resRequest });
        });
    })
    .catch(err => {
      res.status(500).json({ error: `sum ting wong` });
      console.error(err);
    });
};

我不知道为什么-如果没有发现错误-为什么未定义err.response.data有效载荷会成为问题。

任何帮助将不胜感激!

更新:更新了每个axios文档的if语句的前端,但是现在没有错误抛出,它只是继续加载,仍然需要进行操作并刷新修复程序。

 .catch(err => {
      if (err.response) {
            dispatch({
          type: SET_ERRORS,
          payload: err.response.data
        });
          }
    });

1 个答案:

答案 0 :(得分:-1)

由于您需要JSON.parse()响应才能访问数据属性,因此引发错误。

axios
    .post('/request', newRequest)
    // add this
    .then(resp => JSON.parse(resp))
    .then(res => {
      dispatch({
        type: POST_REQUEST,
        payload: res.data
      });
      dispatch(clearErrors());
    })
    .catch(err => {
      dispatch({
        type: SET_ERRORS,
        payload: err.response.data
      });
    });

如果不解析JSON,您的代码将无法访问data属性,因此会引发错误。

一旦抛出,错误对象就没有响应属性。  删除该行,添加console.log,您将看到它引发错误。