Reactjs 如何在Ant设计表中通过条件启用复选框？

当选定行>3时，我想禁用未选定行。我这样做了，但我不知道如何在选定行<3时将其从禁用状态恢复。我该怎么办？我尝试了renderCell返回选中的

selected.length<3

的正常复选框，但它不起作用

---

这是我的代码：

行选择不需要额外的状态。rowSelection的onChange属性为您提供所选行。我们只需要在它上面映射就可以得到行键

onChange: (selectedRowKeys, selectedRows) => {
              setSelected(selectedRows.map(row => row.key))
            },

一旦有了行键，现在我们需要做的就是检查行键是否不是所选键的一部分。如果选定的行大于2，并且该行的键不在选定的键中，则我们将禁用它

getCheckboxProps: (record) => {
              if (selected.length > 2) {
                return {
                  disabled: !selected.includes(record.key) 
                };
              }
            }

完整代码

const Demo = () => {
  const [selected, setSelected] = useState([]);

  return (
    <Table
      rowSelection={{
        onChange: (selectedRowKeys, selectedRows) => {
          setSelected(selectedRows.map(row => row.key))
        },
        getCheckboxProps: (record) => {
          if (selected.length > 2) {
            return {
              disabled: !selected.includes(record.key) 
            };
          }
        }
      }}
      columns={columns}
      dataSource={data}
    />
  );
};

const Demo=（）=>{
const[selected，setSelected]=useState（[]）；
返回(
{
setSelected（selectedRows.map（行=>row.key））
},
getCheckboxProps：（记录）=>{
如果（选定。长度>2）{
返回{
已禁用：！已选择。包括（记录。键）
};
}
}
}}
列={columns}
数据源={data}
/>
);
};

工作沙箱