Soy bastante nuevo en el desarrollo y acabo de empezar con reaccionar. Implementé una tabla de reacción y cuando la representé en el archivo App.js, pero luego abro el navegador, no muestra nada y da un error en la consola. Esta es la instantánea del error . También probé el método Error Boundry para a ver si te sirve pero no
BasicTable.js
import { useTable } from "react-table"; import Mockdata from "./Mockdata.json"; import { Columns } from "./Columns"; export const BasicTable = () => { const columns = useMemo(() => Columns,[]); const data = useMemo(() => Mockdata,[]); const tableInstance = useTable({ columns, 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> ); }; ------------------------------------------------------ Mockdata.json [ { "id":"1a", "name":"Prop1", "defaultValue":"P1" }, { "id":"2a", "name":"Prop2", "defaultValue":"P2" }, { "id":"3a", "name":"Prop3", "defaultValue":"P3" } ] ------------------------------------------------------------ Columns.js export const Columns = [ { Header:'Id', accessor: 'id' }, { Header:'Name', accessor: 'name' }, { Header:'DefaultValue', accessor: 'defaultValue' } ] --------------------------------------------------------- App.js import React from 'react'; import './App.css'; import { BasicTable } from './components/BasicTable'; function App() { return ( <div className="App"> <BasicTable></BasicTable> </div> ); } export default App;