Manejo de errores para una solicitud de API en React.
Estoy tratando de manejar los errores con llamadas API. El objetivo es mostrar un botón solo cuando haya una respuesta exitosa del backend. De lo contrario, no mostrar el botón. Sin embargo, incluso cuando obtengo un error, el botón se mostrará. Aquí está mi código:
handleSubmit = (e) => {
const {
firstName, lastName, country, region, address, city, actions
} = this.props;
e.preventDefault();
verify(firstName, lastName, address, city, region, country)
.then((data) => {
actions.showSuccessNotification(data);
}, () => {
this.setState({
...this.state,
triggerShowButton: true
});
});
}
Aquí es donde estoy generando el botón:
{ (triggerShowButton ) && }
La función
verify
es una función que proviene directamente de otro archivo. Y lo importé. Aquí está:
async function verifyLevelOne(firstName, lastName, addressLine1, city, region, country) {
const options = {
method: ‘POST’,
headers: {
‘content-type’: ‘application/json’
},
data: {
firstName,
lastName,
addressLine1,
city,
region,
country
},
url: ${BASE}/level1
};
return axios(options);
}
El código anterior puede no ser relevante, pero lo muestro aquí en caso de que. ¿Hay alguna forma de hacer que el botón sea visible solo en respuesta exitosa?
davy.ai
Puede modificar su código para comprobar una respuesta exitosa antes de representar el botón. Esto puede hacerse mediante la adición de una declaración
ifpara revisar el estado de la respuesta antes de establecer el estadotriggerShowButton.