estoy en un problema que no puedo ver como salir. Voy a tratar de explicar lo mejor posible: Tengo una app en React la cual en un componente recupera un objeto del LocalStorage, lo parsea, y mediante un bucle hace un Push de determinados elementos a un array, llamemoslo temp. Al momento de hacer console.log a "temp" va todo perfecto, muestra que es un array con 6 elementos, cada uno un sub array de dos elementos. Ahora bien, para que react lo renderice necesito que sea parte del estado de la app, lo cual lo hago mediante el hook useState, de esta manera:
const [teamAverage, setTeamAverage] = useState([]);
Y luego llamo a la funcion del hook, dentro de useEffect y hago un push de cada elemento al estado teamAverage, de esta manera quedaria todo el codigo de la funcion useEffect para cambiar el estado:
useEffect(() =>{
let array = JSON.parse(localStorage.getItem('myTeam')); //llamado al objeto del LocalStorage
let powerStat = {};
for(let i =0; i<array.length;i++){
for(let key in array[i][0].powerstats){
let sum = powerStat[key] || 0;
powerStat[key] = sum += Number.parseInt(array[i][0].powerstats[key]);
}
} //recolecto los items que necesito en powerstat
let temp = [];
for(var item in powerStat){
temp.push([item, powerStat[item]])
}
temp.sort((a, b) => a[1] - b[1]) //ordeno los elementos del array
setTeamAverage(() => {for(let i=0; i < temp.length; i++){
teamAverage.push(temp[i])
};
return teamAverage})
En esta instancia console.log(teamAverage) me devuelve exactamente lo mismo que antes, un array con 6 sub-arrays, osea que estaria todo perfecto. PEROO... al momento de renderizar, cuando accedo a una propiedad por ejemplo {teamAverage[0]} me sale el sub-array completo, pero si quiero acceder solo al primer indice de ese subarray (por ej teamAverage[0][0] me dice "cannot read "0" property of undefined". No entiendo porque es undefined, si previamente el console.log me lo muestra como un array bidimensional.
Espero haberme dado a entender. Gracias por leer hasta aca, y si me pueden orientar eternamente agradecida!