ant-design-vue组件table批量操作

给table绑定一个:row-selection="rowSelection"

 <a-table
    :dataSource="dataSource"
    :columns="columns"
    :row-selection="selection"
    :pagination="pagination"
    rowKey="id"
  >

然后去配置selection

const Selection = ref({
  checkStrictly: false,
  onChange: (selectedRowKeys, selectedRows) => {
    // selectedRowKeys是个数组 被选中行的key  selectedRows也是一个数组，数组的元素是每个条数据对象
    console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows)
  },
  onSelect: (record, selected, selectedRows) => {
    console.log(record, selected, selectedRows)
  },
  onSelectAll: (selected, selectedRows, changeRows) => {
    console.log(selected, selectedRows, changeRows)
  }
})

<a-table> 是 Ant Design Vue 的表格组件，rowSelection 是用于表格行选择的配置对象。在这个配置对象中，有三个方法：onChange、onSelect 和 onSelectAll，它们分别表示行选中状态发生改变、单行选中状态发生改变和全选状态发生改变时的回调函数。

• onChange(selectedRowKeys, selectedRows): 这个方法是当行选中状态发生改变时触发的回调函数。selectedRowKeys 是一个数组，包含当前被选中的行的 key（行标识符）；selectedRows 是一个数组，包含当前被选中的行的数据对象。

• onSelect(record, selected, selectedRows): 这个方法是当单行选中状态发生改变时触发的回调函数。record 是当前被选中或取消选中的行的数据对象；selected 是一个布尔值，表示行的选中状态，true 表示选中，false 表示取消选中；selectedRows 是一个数组，包含当前被选中的所有行的数据对象。

• onSelectAll(selected, selectedRows, changeRows): 这个方法是当全选状态发生改变时触发的回调函数。selected 是一个布尔值，表示是否处于全选状态；selectedRows 是一个数组，包含当前被选中的所有行的数据对象；changeRows 是一个数组，包含最近一次发生改变的行的数据对象。

通过这些参数，你可以在相应的回调函数中获取到所需的信息，从而实现针对行选中状态的逻辑处理，例如更新状态、计算统计信息或执行其他操作。