antd 的selectRowkeys 换变量名不生效了

如果在 Ant Design 的 ProTable 中尝试更改 selectedRowKeys 的属性名（例如换成其他名字），可能会导致无法正确地管理表格行的选中状态。在 ProTable 中，selectedRowKeys 是一个特定的属性名，用于表示当前选中的行的 keys 列表。

如果你需要将 selectedRowKeys 更改为其他属性名，可以通过自定义状态来实现类似的功能。你可以使用另一个变量来存储选中行的 keys 列表，并在需要时更新该变量。

以下是一个示例代码，演示了如何自定义状态来管理表格行的选中状态：

import React, { useState } from 'react';
import { ProTable } from '@ant-design/pro-table';

const columns = [
  {
    title: 'Name',
    dataIndex: 'name',
    key: 'name',
  },
  {
    title: 'Age',
    dataIndex: 'age',
    key: 'age',
  },
];

const data = [
  {
    key: '1',
    name: 'John Brown',
    age: 32,
  },
  {
    key: '2',
    name: 'Jim Green',
    age: 42,
  },
];

const MyTable = () => {
  const [customSelectedRowKeys, setCustomSelectedRowKeys] = useState([]);

  const handleRowSelectionChange = (selectedRowKeys) => {
    setCustomSelectedRowKeys(selectedRowKeys);
  };

  return (
    <ProTable
      columns={columns}
      dataSource={data}
      rowKey="key"
      rowSelection={{
        selectedRowKeys: customSelectedRowKeys,
        onChange: handleRowSelectionChange,
      }}
    />
  );
};

export default MyTable;

在这个示例中，我们使用 customSelectedRowKeys 来代替 selectedRowKeys，并在 handleRowSelectionChange 函数中更新这个自定义状态。通过这种方法，你可以自定义管理表格行的选中状态，而不受 selectedRowKeys 属性名的限制。

希望这个示例能帮助到你！如果你有任何其他问题或需要进一步帮助，请随时告诉我。

转自：ChartGPT