用vue3和antd来实现table子表嵌套效果并且子表支持勾选

可以使用 Antd 的 Table 组件和自定义渲染来实现子表嵌套和勾选功能。具体实现方式如下：

首先，在 Table 组件中使用 `expandable` 属性来开启子表格，并指定子表格的渲染方式。例如：

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

<script>
export default {
  data() {
    return {
      dataSource: [
        {
          key: '1',
          name: 'John Brown',
          age: 32,
          address: 'New York No. 1 Lake Park',
          children: [
            {
              key: '11',
              name: 'John Brown jr.',
              age: 1,
              address: 'New York No. 2 Lake Park',
            },
            {
              key: '12',
              name: 'John Brown jr.',
              age: 1,
              address: 'New York No. 2 Lake Park',
            },
          ],
        },
        {
          key: '2',
          name: 'Jim Green',
          age: 42,
          address: 'London No. 1 Lake Park',
          children: [
            {
              key: '21',
              name: 'Jim Green jr.',
              age: 1,
              address: 'London No. 2 Lake Park',
            },
          ],
        },
        {
          key: '3',
          name: 'Joe Black',
          age: 32,
          address: 'Sidney No. 1 Lake Park',
          children: [
            {
              key: '31',
              name: 'Joe Black jr.',
              age: 1,
              address: 'Sidney No. 2 Lake Park',
            },
          ],
        },
      ],
      columns: [
        {
          title: 'Name',
          dataIndex: 'name',
          key: 'name',
        },
        {
          title: 'Age',
          dataIndex: 'age',
          key: 'age',
        },
        {
          title: 'Address',
          dataIndex: 'address',
          key: 'address',
        },
      ],
      expandable: {
        expandedRowRender: (record) => {
          const columns = [
            { title: 'Name', dataIndex: 'name', key: 'name' },
            { title: 'Age', dataIndex: 'age', key: 'age' },
            { title: 'Address', dataIndex: 'address', key: 'address' },
          ];

          return (
            <a-table
              columns={columns}
              dataSource={record.children}
              rowSelection={{
                type: 'checkbox',
                onChange: (selectedRowKeys, selectedRows) => {
                  console.log(selectedRowKeys, selectedRows);
                },
              }}
            />
          );
        },
      },
    };
  },
};
</script>

在 `expandedRowRender` 中，我们可以自定义子表格的列和数据源，并使用 `rowSelection` 属性来指定勾选功能。

这样就可以实现 Antd Table 组件的子表嵌套和勾选功能了。