javascript - 错误: Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'data' )

Question

我正在使用 Spring Boot 和 React 编写应用程序。我正在运行服务器并想从客户端提交表单。该表单应保存在数据库中。

我填写了表单并将其保存在数据库中，但是填写表单并单击“提交”按钮后，页面应切换到应用程序的主屏幕，即 /dashboard 地址，但我仍然保留表单，当我进入开发工具时，我收到一个错误:未捕获( promise )类型错误:无法读取未定义的属性(读取“数据”) .

也就是说，应用程序本身可以工作，数据在客户端和服务器之间传输并存储在数据库中。所以问题出在前端，特别是react端。该消息还指出出现问题的特定文件，即在文件 projectActions.js

中

但是，我不太清楚问题具体是什么，我在哪里犯了错误，提交表单后的页面没有“重新加载”并返回到指定的地址。

下面我发送错误中引用的类。

我还提供了我使用的软件包的版本:

    "axios": "^0.27.2",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-redux": "^8.0.2",
    "react-router-dom": "^6.3.0",
    "react-scripts": "5.0.1"

projectActions.js

import axios from "axios";
import { GET_ERRORS } from "./types";

export const createProject = (project, history) => async (dispatch) => {
  try {
    const res = await axios.post("http://localhost:8080/api/project", project);
    history.push("/dashboard");
  } catch (error) {
    dispatch({
      type: GET_ERRORS,
      payload: error.response.data,
    });
  }
};

Answer 1

您的问题出在 catch block 内，您正在尝试读取 error.response.data，问题是因为没有 response属性错误时，它是未定义的，当您尝试读取未定义的数据时，您最终会遇到此错误。 根据错误类型 error 将具有不同的结构。请阅读本文以了解如何处理 axios 错误(您需要安全检查):axios-error-handling