Mis datos no son visibles dentro de las celdas de la tabla de reacción:

 import React, { useMemo } from 'react' import { useTable } from 'react-table/dist/react-table.development' import MOCK_DATA from '../mock/components/LandingTableMock.json' import { COLUMNS } from './LandingTableColumns' import '../static/styles/globalVar.css' export const LandingTable = () => { const columns = useMemo(() => COLUMNS, []) const data = useMemo(() => MOCK_DATA, []) const tableInstance = useTable ({ columns: columns, //columns: COLUMNS, data //data: MOCK_DATA }) const { getTableProps, getTableBodyProps, headerGroups, rows, prepareRow } = tableInstance return ( <table {...getTableProps()}> <thead> { headerGroups.map((headerGroup) => ( <tr {...headerGroup.getHeaderGroupProps()}> { headerGroup.headers.map((column) => ( <th {...column.getHeaderProps()}> {column.render('Header')} </th> ) )} </tr> )) } </thead> <tbody {...getTableBodyProps()}> {rows.map((row) => { prepareRow(row) return ( <tr {...row.getRowProps()}> {row.cells.map( (cell) => { return <td {...cell.getCellProps()}> {cell.render('Cell')}</td> })} </tr> ) })} </tbody> </table> ) }

Puse un punto de interrupción para inspeccionar el valor de las celdas y no está definido.

MOCK_DATA y COLUMNS se ven bien, no es un problema de inclusión. Los moví en el mismo archivo y sigue sin funcionar.

El resultado es una tabla con el número correcto de filas pero con celdas vacías:

Seguí este tutorial en youtube.