Antd的table如何实现“可选择”

例如：实现批量删除

<div  @click="batchDelete">批量删除</div>
<a-table
  :columns="columns"
  :data-source="data"
  class="unitTable"
  :row-selection="rowSelection"
  rowKey="id"
>
</a-table>
<script lang="ts" setup>
import { materialOptionDelete } from "@/api/materielManage/productExpansion";
const selectedRecordIds = ref();
interface DataItem {}
const rowSelection = ref({
  checkStrictly: false,
  onChange: (
    selectedRowKeys: (string | number)[],
    selectedRows: DataItem[]
  ) => {
    selectedRecordIds.value = selectedRowKeys;  //将选中的行的id赋值给selectedRecordIds
  },
  onSelect: (record: DataItem, selected: boolean, selectedRows: DataItem[]) => {
    console.log(record, selected, selectedRows);
  },
  onSelectAll: (
    selected: boolean,
    selectedRows: DataItem[],
    changeRows: DataItem[]
  ) => {
    console.log(selected, selectedRows, changeRows);
  },
});

// 批量删除
const batchDelete = async () => {
  await materialOptionDelete(selectedRecordIds.value);
};
</script>

注意：rowKey的取值是该行的key值，官方默认是"key"是改行的key值（不写就算默认），而我的每行的key值是id，所以我需要写rowKey="id"。（要注意自己的数据的key值是什么）