反应表列不显示数据

如何解决反应表列不显示数据

我正在使用 React Table，并且我正在尝试使我的表格可点击以链接到不同的页面以达到行。但现在我没有错误屏幕，我的列没有显示任何行的任何数据。

（当我拿走

 Cell: (props) =>
        linkTo(`ticket/[id]`,props.ticket_title,`ticket/${props.ticket_id}`),

一切恢复正常）

这是我的专栏文件：

import { linkTo } from '../utils/linkTo';
import { tableFormatted } from '../utils/tableFormatted';

export const TICKET_COLUMNS = [
    {
        Header: 'Ticket Number',accessor: 'ticket_id',},{
        Header: 'Title',accessor: (d) => `${d.ticket_title} ${d.ticket_id}`,Cell: (props) =>
            linkTo(`ticket/[id]`,{
        Header: 'Description',accessor: 'ticket_text',{
        Header: 'Priority',accessor: 'ticket_priority',Cell: (props) => tableFormatted(props.value),{
        Header: 'Status',accessor: 'ticket_status',{
        Header: 'Type',accessor: 'ticket_type',];

这是我用来尝试使单元格可点击的linkTo函数：

import { Link } from '@chakra-ui/layout';
import NextLink from 'next/link';

export const linkTo = (
    linkInput: string,children: string,asInput?: string
) => {
    if (asInput) {
        return (
            <>
                <NextLink href={linkInput} as={asInput}>
                    <Link>{children}</Link>
                </NextLink>
            </>
        );
    } else {
        return (
            <>
                <NextLink href={linkInput}>
                    <td>{children}</td>
                </NextLink>
            </>
        );
    }
};

这是桌子本身，虽然我不认为桌子有问题，但谁知道呢，当然不是我哈哈。：

import React,{ useMemo } from 'react';
import { Table } from 'react-bootstrap';
import { Column,useGlobalFilter,useTable } from 'react-table';
import { GlobalFilter } from './GlobalFilter';

type TestTableProps = {
    dataInput: any[];
    columnInput: any[];
    userInput?: any;
};

export const TestTable: React.FC<TestTableProps> = ({
    dataInput,columnInput,userInput,}) => {
    const meData = userInput ? userInput : null;
    const isData = dataInput ? dataInput : [{}];

    const columns = useMemo<Column<object>[]>(() => columnInput,[]);
    const data = useMemo(() => isData,[isData]);

    const {
        getTableProps,getTableBodyProps,headerGroups,rows,prepareRow,state,setGlobalFilter,} = useTable(
        {
            columns,data,useGlobalFilter
    );

    const { globalFilter } = state;

    if (!isData) {
        return <>no data</>;
    } else {
        return (
            <>
                <GlobalFilter filter={globalFilter} setFilter={setGlobalFilter} />
                <Table
                    {...getTableProps()}
                    striped
                    bordered
                    hover
                    responsive
                    variant="dark"
                >
                    <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>
            </>
        );
    }
};