Hola, solo quiero representar una tabla donde el nombre de la columna de nombre y su valor se obtengan dinámicamente de una API ... y almaceno el valor de la columna en una nueva matriz; Quiero devolver el valor de las filas que se vinculan con el nombre de la columna en una fila

 const element = [ "ENDURANCE", "SPEED", "AGILITY", "STRENGTH" ] // this is my column name

api datos de valor de filas

 ​[ { AGILITY: 1 ENDURANCE: 1 SPEED: 1 STRENGTH: 1 _id: "62c53266b631f27c54db8d89" date: "7/6/2022" }, { AGILITY: "4" ENDURANCE: "4" SPEED: "6" STRENGTH: "2" _id: "62c5a047a053c4ebb5de8c10" date: "7/6/2022" }, ​{ AGILITY: "8" ENDURANCE: "6" SPEED: "5" STRENGTH: "10" _id: "62c5a053a053c4ebb5de8c14" date: "7/6/2022" } ]

Acabo de mapear este valor en la tabla dinámicamente, este es mi código ...

 <table className="table"> <thead> <tr> <th>/</th> <th>Date</th> {props.data.map((cur, i) => { element.push(cur[0]) //store all column names return <th key={i}>{cur[0]}</th>; })} </tr> </thead> <tbody> {props.stdata.map((curr, index) => { console.log(element); return ( <> <tr> <td>{index+1}</td> <td> {curr.date} // date element is same in every api data </td> <td>{ curr[element] // may be this is wrong }</td> </tr> </> ); })} </tbody> </table>

así es como se ve la mesa