ant design vue2表格复选框全选处添加文字

在 Ant Design Vue2 表格中，可以通过设置 `row-selection` 属性来为表格添加复选框。如果需要为复选框全选处添加文字，可以在 `row-selection` 属性中设置 `checkStrictly` 和 `renderCell` 两个属性。具体做法如下：

1. 在 Table 组件中设置 `row-selection` 属性，其中 `checkStrictly` 属性用于控制是否严格检查复选框的选中状态，`renderCell` 属性用于渲染复选框列，并在全选处添加文字。

<template>
  <a-table :columns="columns" :data-source="data" row-selection="{checkStrictly: true, renderCell: renderSelection}">
  </a-table>
</template>

2. 在 `methods` 中定义 `renderSelection` 方法，用于渲染复选框列和全选处文字。在 `renderSelection` 方法中，先根据 `record` 和 `index` 判断当前行是否可选，然后根据 `record` 的 `selected` 属性确定复选框的选中状态，最后在全选处添加文字。

<script>
export default {
  data() {
    return {
      columns: [
        {
          title: '',
          dataIndex: 'checkbox',
          width: '50px'
        },
        {
          title: 'Name',
          dataIndex: 'name',
          key: 'name'
        },
        {
          title: 'Age',
          dataIndex: 'age',
          key: 'age'
        }
      ],
      data: [
        {
          id: '1',
          name: 'John Brown',
          age: 32,
          selected: false
        },
        {
          id: '2',
          name: 'Jim Green',
          age: 42,
          selected: false
        },
        {
          id: '3',
          name: 'Joe Black',
          age: 32,
          selected: false
        }
      ]
    };
  },
  methods: {
    renderSelection(h, { record, index }) {
      const selectable = !record.disabled;
      const selected = record.selected;
      return (
        <div class="selection-cell">
          <a-checkbox
            value={record.id}
            disabled={!selectable}
            checked={selected}
            on-change={(e) => this.handleSelectionChange(e, record)}
          ></a-checkbox>
          {index === 0 && (
            <span class="selection-all">
              {this.isAllSelected() ? '取消全选' : '全选'}
            </span>
          )}
        </div>
      );
    },
    isAllSelected() {
      return this.data.every((item) => item.selected);
    },
    handleSelectionChange(e, record) {
      record.selected = e.target.checked;
    }
  }
};
</script>

<style scoped>
.selection-cell {
  display: flex;
  align-items: center;
}
.selection-all {
  margin-left: 10px;
  color: #1890ff;
  cursor: pointer;
}
</style>

这样就可以为表格的复选框全选处添加文字了。需要注意的是，如果需要获取选中的行，可以通过 `this.data.filter(item => item.selected)` 来获取。