如何解决 react-table 错误：- TypeError: plugin is not a function

Question

我使用 react-table 和 useTable 钩子创建了一个基本的反应表。我收到此错误：

TypeError: plugin is not a function.

我该如何解决这个错误？

这是我的代码：

import Reactt,{ useMemo } from 'react'
import { useTable } from "react-table";
import COLUMNS from "./columns";
import MOCK_DATA from '../MOCK_DATA.json'
import '../table.css'
const BasicTable = () => {
const columns = useMemo(() => COLUMNS, []);
const data = useMemo(() => MOCK_DATA, []);   
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.getHeaderGroups()}>{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>
        )
    }  
export default BasicTable

Answer 1

您应该将columns 和data 作为选项对象传递。改为这样做

useTable({columns,data})

https://react-table.tanstack.com/docs/api/useTable#usetable

Answer 2

也不确定它是否会弄乱你的代码，但你写的是“import Reactt”而不是“import React”