反應表： hooks.visibleColumns 未定義

Question

const {
getTableProps,
getTableBodyProps,
headerGroups,
rows,
prepareRow,
selectedFlatRows,
state: { selectedRowIds }} = useTable(
{
  columns: COLUMNS,
  data: testdata,
},
useRowSelect,
(hooks) => {
  hooks.visibleColumns.push((columns) => [
    {
      id: "selection",

      Header: ({ getToggleAllRowsSelectedProps }) => (
        <div>
          <IndeterminateCheckbox {...getToggleAllRowsSelectedProps()} />
        </div>
      ),
Cell: ({ row }) => (
        <div>
          <IndeterminateCheckbox {...row.getToggleRowSelectedProps()} />
        </div>
      )
    },
    ...columns
  ]);
}

);

上面的代碼導致Uncaught TypeError: Cannot read properties of undefined (reading 'push')因為 hooks.visibleColumns 是未定義的。 我在 Rails 應用程序中使用 react ，所以如果這可能會導致任何問題，請注意，但除了鈎子部分之外，一切似乎都正常工作。 關於如何解決這個問題的任何想法？

任何幫助表示贊賞

Answer 1

我認為您應該在下面的 push() 之后添加 return：

(hooks) => {   
    hooks.visibleColumns.push((columns) => {
    return [
    {
      id: "selection",

      Header: ({ getToggleAllRowsSelectedProps }) => (
        <div>
          <IndeterminateCheckbox {...getToggleAllRowsSelectedProps()} />
        </div>
      ), Cell: ({ row }) => (
        <div>
          <IndeterminateCheckbox {...row.getToggleRowSelectedProps()} />
        </div>
      )
    },
    ...columns   ]; }); }