Estoy escribiendo aplicaciones en Spring Boot y reacciono. Estoy ejecutando un servidor y quiero enviar un formulario desde el lado del cliente. El formulario debe guardarse en la base de datos.
Completé el formulario y se guardó en la base de datos, pero después de completar el formulario y hacer clic en el botón "enviar", la página debería cambiar a la pantalla principal de la aplicación, es decir, la dirección /dashboard , pero aún me quedo con el form y cuando ingreso a devtools obtengo un ERROR : Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'data').
Es decir, resulta que la aplicación en sí funciona, los datos se transfieren entre el cliente y el servidor y se almacenan en la base de datos. Entonces, el problema radica en el lado de la interfaz, específicamente en el lado de reacción. El mensaje también apunta al archivo específico donde está el problema, es decir, en el archivo projectActions.js
Sin embargo, no sé demasiado sobre cuál es el problema específicamente, donde cometí un error, que la página después de enviar el formulario no se "recarga" y regresa a la dirección especificada.
A continuación envío la clase a la que se hace referencia en el error.
También proporciono las versiones de los paquetes que uso:
"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"proyectoAcciones.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, }); } };Su problema está dentro del bloque catch , está tratando de leer error.response.data , y el problema se debe a que no hay un atributo de response en el error, no está definido, y cuando intenta leer data en undefined, terminará con este error . Dependiendo del tipo de error, el error tendrá diferentes estructuras. Lea esto para tener una idea de cómo manejar el error de axios (necesita verificaciones seguras): axios-error-handling
el problema esta en
payload: error.response.data,si está seguro de que la mayor parte de su error tiene esta estructura, puede usar payload: error?.response?.data .
Tenga en cuenta que realmente no vi una estructura error.response.data en un mensaje de error antes. Por lo tanto, es mejor que cambie la forma en que maneja el error.