No puedo entender qué podría estar mal. Estoy tratando de mapear datos que se ven así.
[ RowDataPacket { id: 1, words: 'one', numbers: 1 }, RowDataPacket { id: 2, words: 'two', numbers: 2 } ]en una tabla pero termina sin mostrar nada.
Lo he intentado incluso con forEach pero el mismo resultado, realmente si alguien me ayuda con este, realmente lo agradecería.
function TableCrud ({dbIo, isLoading, dbData}){ async function triggerFetch() { const dbData = await dbIo('getData') console.log(dbData + ' dbData awaited inside TableCrud')// Console.log } function insertRow(data) { if (isLoading) { triggerFetch() return ( <tr> <td id='no-data' colSpan='3'>Wait...</td> </tr> ) } else if(data.length === 0) { return ( <tr> <td id='no-data' colSpan='3'>Nothing to Display</td> </tr> ) } else { data.map((item, index) => { return ( <tr key={index}> <td>{item.words}</td> <td>{item.numbers}</td> <td><input className='input-check' id={'select-'+index} type="checkbox"/></td> </tr> ) }) } } return ( <div id='table-data'> <table id='table'> <thead> <tr> <th>Word</th> <th>Number</th> <th>Selected</th> </tr> </thead> <tbody id='table-body'> {insertRow(dbData)} </tbody> </table> </div> ) }puedes intentar algo como esto
if(!data){ return ( <tr> <td id='no-data' colSpan='3'>Nothing to Display</td> </tr> )else if(data.length !== 0){ data.map((item, index) => { return ( <tr key={index}> <td>{item.words}</td> <td>{item.numbers}</td> <td><input className='input-check' id={'select-'+index} type="checkbox"/></td> </tr> ) }) } }Creo que su muestra no es JSON válida:
[ RowDataPacket { id: 1, words: 'one', numbers: 1 }, RowDataPacket { id: 2, words: 'two', numbers: 2 } ]Tendría que verse así para trabajar con su mapa:
[ { id: 1, words: 'one', numbers: 1 }, { id: 2, words: 'two', numbers: 2 } ]Sentencia de retorno perdida. Debería ser como:
return data.map((item, index) => { return ( <tr key={index}> <td>{item.words}</td> <td>{item.numbers}</td> <td><input className='input-check' id={'select-'+index} type="checkbox"/></td> </tr> ) })Entonces la función puede devolver el resultado de map(). :)