Estoy intentando hacer una petición get
con React y Node. El problema es que la data sí llega al front, pero no aparece nada en pantalla, no sé cual es el problema, porque no me da ningún error. En el useEffect mando a llamar loadFuncionarios
y luego, pongo la data en el hook.
Dejo parte de mi código del frontend:
const [resultPerfiles, setResultPerfiles] = useState([]);
const loadFuncionarios = async () => {
const token = getCookie("token");
await axios
.get(`${process.env.REACT_APP_API_URL}/user`, {
headers: {
Authorization: `Bearer ${token}`,
},
})
.then((res) => {
console.log("esto es res: ", res.data);
setResultPerfiles(res.data)
})
.catch((err) => {
console.log("Hubo un error en su petición", err);
})};
Mi código en el HTML:
return (
<Navbar />
<Container>
<ToastContainer />
<h2>Datos</h2>
<Row>
<div>
{resultPerfiles.map((item) => {
<h2>{item.role}</h2>;
})}
</div>
</Row>
</Container>
); }
ya he intentado de todo, no sé qué pueda ser. En el backend me imprime tal y como se los mencioné: un arreglo de objetos. Espero su ayuda, muchas gracias.
Edit: lo que me llega en el frontend es esto:
Este es el useEffect que llama a loadFuncionarios
Y esta hay en el backend (aunque en consola si se pinta el arreglo):
console.log("esto es res: ", res.data);
Esta linea si la logras ver en la consola?setResultPerfiles([{...resultPerfiles, res.data}])
pero nada, e incluso me lanza errores.loadFuncionarios
y que objetivo tiene eseawait
cuando ya usasthen
, y no estás esperando ningún resultado, no le veo sentido a eso.