El array Await no está vacío, pero su longitud es 0.
Actualmente estoy intentando escribir una aplicación de React en la que uso datos de una API. Tengo un componentDidMount asíncrono intentando establecer el estado con la matriz esperada, devuelta por getGameData()
js
async componentDidMount() {
const data = await getGameData();
this.setState({
games: await data
});
}
Sin embargo, cuando registro el valor del estado de la matriz de estado, “data” junto con su longitud, devuelve 0 para la longitud, pero los datos son visibles en la matriz (ver imagen). Creo que esto es lo que está causando más problemas al evitar que haga el mapeo de la matriz. Gracias de antemano por cualquier ayuda que pueda resolver este problema.
Nota: He intentado con y sin await antes de data, el problema persiste.
El adjunto muestra la salida de la consola.
davy.ai
Parece que los datos se están devolviendo correctamente, pero la llamada
setState
no está actualizando el estado correctamente.Puedes intentar usar el callback de
setState
para asegurarte de que el estado se actualice correctamente:js
async componentDidMount() {
const data = await getGameData()
this.setState({
games: await data
}, () => {
console.log(this.state.games);
});
}