ant design vue2 表格添加复选框

可以使用 ant design vue2 中的 Table 组件，在列定义中添加一个 dataIndex 为 'selection' 的项，即可实现表格添加复选框的功能。具体实现代码如下：

<template>
  <a-table :columns="columns" :data-source="dataSource" row-selection />
</template>

<script>
import { Table } from 'ant-design-vue'

export default {
  components: {
    'a-table': Table
  },
  data() {
    return {
      columns: [
        {
          title: '姓名',
          dataIndex: 'name'
        },
        {
          title: '年龄',
          dataIndex: 'age'
        },
        {
          title: '性别',
          dataIndex: 'gender'
        },
        {
          title: '操作',
          dataIndex: 'operation'
        },
        {
          dataIndex: 'selection',
          width: '50px',
          align: 'center',
          render: (text, record) => {
            return <a-checkbox v-model={record.checked} />
          }
        }
      ],
      dataSource: [
        {
          name: '张三',
          age: 18,
          gender: '男',
          operation: '编辑',
          checked: false
        },
        {
          name: '李四',
          age: 20,
          gender: '女',
          operation: '编辑',
          checked: false
        },
        {
          name: '王五',
          age: 22,
          gender: '男',
          operation: '编辑',
          checked: false
        }
      ]
    }
  }
}
</script>

在上面的代码中，我们定义了一个包含复选框的列，并且在 Table 组件中启用了 row-selection 属性，即可实现表格添加复选框的功能。