Necesita una salida como esta . Los encabezados son dinámicos y el cuerpo no se representa correctamente. por favor ayúdame a arreglarlo.
aquí mi código:
{ data?.show && <th className="text-center" key={index}> <td colSpan={data?.st && data.st.length} style={{ border: "none" }}> {data.label} </td> <tr className="p-0"> { data?.st?.map(sub => { return ( <td style={{ borderColor: "black" , fontWeight: "400" }}> {sub} </td> ) }) } </tr> </th> } <tbody> { res.datas && res.datas.map((ele, index) => { var eles = Object.values(ele); return ( <> <tr key={index}> <td align="center">{1 + index}</td> { eles.map(dt => { return ( <td align={typeof (dt)==="string" ? "left" : "center" }> {dt} </td> ) } ) } </tr> </> ) }) } </tbody>Pero obtuve una salida como esta. este El resultado esperado se agrega en la parte superior.
