Estoy devolviendo una lista de 2 objetos de mi API y he usado una recuperación en el componente de perfil con éxito para establecer el estado de userStats para que sea este objeto JSON:

 [{"userStatsId":1,"victories":0,"draws":0,"defeats":0},{"userStatsId":2,"victories":0,"draws":0,"defeats":0}]

Esto también es lo que se imprime en la consola en el código a continuación, por lo que el estado definitivamente se establece correctamente y se pasa al método de procesamiento.

Anteriormente, me devolvían objetos JSON que contenían esos objetos UserStat y accedía a los valores usando:

 <td className="player-list-key-number">{user.userStats[0].victories}</td>

Así que asumí ahora que simplemente estoy devolviendo la lista de los 2 objetos UserStat que lógicamente debería hacer:

 <h3 id="stats">Stats</h3> <CardGroup> <Card className="stat-card"> <CardImg></CardImg> <CardTitle>Total Victories</CardTitle> <CardText className="victory-text">{userStats[0].victories}</CardText> </Card>

Etc...

Sin embargo, esto provoca un error:

 Uncaught TypeError: Cannot read properties of undefined (reading 'victories')

En el componente de perfil:

render() { const {usuario, imagen de perfil, estadísticas de usuario, está cargando} = este.estado;

 console.log(this.props.location); console.log("USER:"); console.log(user); console.log("USERSTATS:"); console.log(userStats); if (isLoading) { return <p>Loading...</p>; } return ( <h3 id="stats">Stats</h3> <CardGroup> <Card className="stat-card"> <CardImg></CardImg> <CardTitle>Total Victories</CardTitle> <CardText className="victory-text">{userStats[0].victories}</CardText> </Card> <Card className="stat-card"> <CardTitle>Total Defeats</CardTitle> <CardText className="defeats-text"></CardText> </Card> )

¿Cómo puedo acceder a estos valores ahora que no están en el objeto Usuario externo?

Gracias