使用vue 用antd ui写一个表格嵌套表格,支持展开，和全选

可以通过在表格中使用 expandable 和 rowSelection 属性来实现表格嵌套表格，支持展开和全选。以下是一个基本的示例：

<template>
  <a-table :columns="columns" :data-source="data" :expandable="expandable" :row-selection="rowSelection">
    <template #expanded-row="{record}">
      <a-table :columns="innerColumns" :data-source="record.children" />
    </template>
  </a-table>
</template>

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

export default {
  components: { Table },
  data() {
    return {
      columns: [
        { title: '姓名', dataIndex: 'name' },
        { title: '年龄', dataIndex: 'age' },
        { title: '性别', dataIndex: 'gender' },
      ],
      innerColumns: [
        { title: '学科', dataIndex: 'subject' },
        { title: '成绩', dataIndex: 'score' },
      ],
      data: [
        { key: 1, name: '张三', age: 18, gender: '男', children: [
          { key: 11, subject: '语文', score: 85 },
          { key: 12, subject: '数学', score: 90 },
        ]},
        { key: 2, name: '李四', age: 20, gender: '女', children: [
          { key: 21, subject: '语文', score: 80 },
          { key: 22, subject: '数学', score: 95 },
        ]},
      ],
      expandable: {
        defaultExpandAllRows: true,
      },
      rowSelection: {
        type: 'checkbox',
        onSelectAll: (selected, selectedRows, changeRows) => {
          console.log(selected, selectedRows, changeRows);
        },
      },
    };
  },
};
</script>

在上面的示例中，我们在外层表格中设置了 expandable 属性为 `{ defaultExpandAllRows: true }`，使得表格默认展开全部行，同时在内层表格中也使用了 a-table 组件来展示子表格。

我们还设置了 rowSelection 属性，使得表格支持全选功能，当用户选中或取消选中行时，会触发 onSelectAll 回调函数，可以在该函数中处理选中的行数据。