错误：未捕获(在承诺中) 类型错误：无法读取未定义的属性(读取"数据")

Question

我正在用spring boot和react编写应用程序。我正在运行一个服务器，并希望从客户端提交表单。该表单应该保存在数据库中。

我填写了表格，它被保存在数据库中，但在填写表格并点击"提交"后;按钮页面应该切换到应用程序的主屏幕，即/dashboard地址，但我仍然留在表单，当我进入devtools时，我得到一个ERROR:Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'data').

也就是说，应用程序本身工作，数据在客户端和服务器之间传输并存储在数据库中。所以问题出在前端，特别是反应端。该消息还指出了问题所在的特定文件，即文件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块内，您正在尝试读取error.response.data，问题是因为错误上没有response属性，它是未定义的，当您尝试在未定义上读取data时，您将最终出现此错误。根据不同的错误类型，error将有不同的结构。请阅读本文以了解如何处理axios错误(您需要安全检查):axios-error-handling

Answer 2

问题是在

payload: error.response.data,

如果您确定大多数错误都具有此结构，则可以使用payload: error?.response?。数据。

请记住，我以前确实没有在错误消息中看到error.response.data结构。所以你最好改变处理错误的方式。