Digamos que tengo debajo de los datos
const data = [ { id: 1, name: "Tim", score: [ { score: 4, type: "communication" }, { score: 4, type: "delivery" } ] }, { id: 2, name: "Ken", score: [ { score: 2, type: "communication" }, { score: 4, type: "delivery" } ] } ];y debajo de la variable de objeto al principio
let typeTotalScore = { communication: 0, delivery: 0 };y gancho useState
const [scoreByType, setScoreByType] = useState({}); Quiero recorrer data y obtener el siguiente resultado y luego usar setScoreByType(typeTotalScore) .
{ communication: 6, delivery: 8 } ¿Cómo debo hacerlo en useEffect
useEffect(() => { async function fetchData() { let typeTotalScore = { communication: 0, delivery: 0 }; // some looping? setScoreByType(typeTotalScore) } fetchData(); }, []);Puede usar Array#flatMap para combinar toda la matriz de puntajes en una sola. Luego use Array#reduce para sumar el valor
const data = [ { id: 1, name: "Tim", score: [ { score: 4, type: "communication" }, { score: 4, type: "delivery" } ] }, { id: 2, name: "Ken", score: [ { score: 2, type: "communication" }, { score: 4, type: "delivery" } ] } ]; const res = data.flatMap(a=> a.score).reduce((acc,{type,score})=>{ acc[type] = acc[type] || 0; //check the key and assigning the value acc[type] = acc[type] + score // sum the previous score with new return acc },{}) console.log(res)