快速浏览了一下。试试这个：

• 有一个 rowId 的状态

const [selectedRowId, setSelectedRowId] = useState(null);

• 传递autoResetSelectedRows: false,给useTable函数

• 手动为收音机编写一个点击处理程序

  onClick={() => setSelectedRowId(row.id)}

我在这里整理了工作代码。 https://codesandbox.io/s/objective-faraday-gzf7y

笔记：

• 快速变化的值可能存在一些小问题selectedFlatRows。我还没有完全研究过这个问题，但我发现了https://github.com/tannerlinsley/react-table/issues/1740。问题说已解决，但我不完全确定。
• 如果您在抓取行数据时遇到问题，请尝试查看以下链接是否有帮助 如何获取 React Table Row Data Onclick https://codesandbox.io/s/tannerlinsleyreact-table-row-selection-hoisted-b4dvq?from -embed 在点击react表上选择行

根据之前的答案，下面的解决方案有一些改进

1. 将复选框更改为单选输入

   IndeterminateCheckbox 组件内部

   Remove  <input type="checkbox" ref={resolvedRef} {...rest} />*/}
   Add     <input type="radio" ref={resolvedRef} {...rest} />
   

2. a) 如果要初始自动选择任何行，请设置初始状态

   b) 取消选择所有单选按钮

   c) row.getToggleRowSelectedProps().checked给出该行单选按钮的当前状态。因此相应地切换该值。IE

   如果选中-> 更改为未选中和

   如果未选中-> 更改为选中

   // This selectedRowIds state gives the information about which row is selected currently.
   const{state: { selectedRowIds }}=useTable(
   {
    ....
    initialState: {
         columns,
         data,
         selectedRowIds: { 2: true },  //a) I want my second row to be autoselected initially
      },
    },
    useRowSelect,
        hooks => {
            hooks.visibleColumns.push(columns => [
                {
                    id: "selection",                    
                    Cell: ({ row, toggleAllRowsSelected, toggleRowSelected }) => {                      
                       const currentState = row.getToggleRowSelectedProps();
                       return (
                          <IndeterminateCheckbox
                             {...currentState}
                             onClick={() => {
                               // b)
                                 toggleAllRowsSelected(false);
                               // c)
                                 toggleRowSelected(row.id, !currentState.checked);
                         }} />)
   
                       }},
                         ...columns
                       ]);
                       })
   

如果有人仍在为此苦苦挣扎，我找到了不同的解决方案。

IndeterminateCheckbox 与输入类型略有变化相同：

const IndeterminateCheckbox = React.forwardRef(
    ({ indeterminate, ...rest }, ref) => {
        const defaultRef = React.useRef();
        const resolvedRef = ref || defaultRef;

        React.useEffect(() => {
            resolvedRef.current.indeterminate = indeterminate;
        }, [resolvedRef, indeterminate]);

        return (
            <>
                {/*<input type="checkbox" ref={resolvedRef} {...rest} />*/}
                <input type="radio" ref={resolvedRef} {...rest} />
            </>
        );
    }
);

然后 onClick 我们取消选择所有行，并选择“单击”行。:)

 const {
            getTableProps,
            getTableBodyProps,
            headerGroups,
            rows,
            prepareRow,
            toggleAllRowsSelected,
            toggleRowSelected,
            state: { selectedRowIds },
        } = useTable(
            {
                columns,
                data,
            },
            useRowSelect,
            hooks => {
                hooks.visibleColumns.push(columns => [
                    // Let's make a column for selection
                    {
                        id: "selection",
                        // The cell can use the individual row's getToggleRowSelectedProps method
                        // to the render a checkbox
                        Cell: ({ row }) => {
                            return (
                                <div>
                                    <IndeterminateCheckbox
                                        {...row.getToggleRowSelectedProps()}
                                        onClick={() => {
                                            toggleAllRowsSelected(false);
                                            toggleRowSelected(row.id, true);
                                        }}
                                    />
                                </div>
                            );
                        }
                    },
                    ...columns
                ]);
            }
        );