在response-js-onSubmit中调用多个处理程序方法

Question

我正在做一个React JS项目，该项目使用带有onSubmit的搜索表单组件。我想调用多个搜索处理程序方法，使Axios同时调用多个后端API。我使用的是一个类组件，我的onSubmit调用了一个searchHandler方法，该方法包含对后端的多个axios调用。但当我提交表格时，我收到了一个错误：前端错误

这是我的onSubmit调用的搜索处理程序函数，它包含两个Axios调用：

applicationSearchHandler(event) {
event.preventDefault();
console.log(this.state.number, this.state.orgChoice);
LoanAppDataService.getPromoCodeExpiryInfo(
this.state.orgChoice,
this.state.promoCode,
this.state.number
)
.then((response) => {
if (response && response.data && response.data.length > 0) {
console.log(response.data[0].applicationId);
this.setState((state) => ({
...this.state,
expiryStatusMessage: response.data[0].message,
isSearched: true,
error: false,
}));
}
})
.catch((error) => {
this.setState({
error: !this.state.error,
errorAlert: "",
isSearched: false,
});
});
LoanAppDataService.getCorrectPromoCodeInfoEmailAndOrgId(
this.state.emailId,
this.state.orgChoice
)
.then((response) => {
this.setState((state) => ({
associatedPromoMessage: response.data[0].message,
isSearched: true,
error: false,
}));
})
.catch((error) => {
this.setState({
error: !this.state.error,
errorAlert: "",
isSearched: false,
});
});
this.setState((state) => ({
...this.state,
number: "",
customerName: "",
orgChoice: "",
}));
const isValid = this.validateSsn();
}

这就是我的onSubmit的样子：

<form onSubmit={this.applicationSearchHandler}>

我不知道如何纠正这个错误，我尝试了多种方法，但目前似乎都不起作用。

Answer 1

您在代码的这一部分中遇到错误

expiryStatusMessage:响应.data[0]消息

很可能是response.data[0]为null或未定义，此代码试图从null中查找消息，因此它给出错误

你可以像一样在这里使用零位运算符

expiryStatusMessage:响应.data[0]？。消息