树形数据与懒加载 ​

<template>
  <TableGenerator ref="RefTableGenerator" v-bind="{ ...tableAttrs }" :showIndex="false" row-key="id" lazy :load="load"
    :tree-props="{ children: 'children', hasChildren: 'hasChildren' }" />
</template>

<script lang="tsx" setup>
import { TableGenerator } from 'element-plus-generator'
import type { TableAttrs, RefTableGenerator } from 'element-plus-generator/lib/type'
import { ref, onMounted } from 'vue'

const RefTableGenerator = ref<RefTableGenerator>()
const tableAttrs = ref<TableAttrs>({
  data: [
    {
      id: 1,
      date: '2016-05-02',
      name: 'wangxiaohu',
      address: 'No. 189, Grove St, Los Angeles',
    },
    {
      id: 2,
      date: '2016-05-04',
      name: 'wangxiaohu',
      address: 'No. 189, Grove St, Los Angeles',
    },
    {
      id: 3,
      date: '2016-05-01',
      name: 'wangxiaohu',
      address: 'No. 189, Grove St, Los Angeles',
      children: [
        {
          id: 31,
          date: '2016-05-01',
          name: 'wangxiaohu',
          address: 'No. 189, Grove St, Los Angeles',
        },
        {
          id: 32,
          date: '2016-05-01',
          name: 'wangxiaohu',
          address: 'No. 189, Grove St, Los Angeles',
        },
      ],
    },
    {
      id: 4,
      date: '2016-05-03',
      name: 'wangxiaohu',
      address: 'No. 189, Grove St, Los Angeles',
      hasChildren: true
    },
  ],
  tableOption: [
    {
      prop: 'date',
      label: 'Date',
      width: '180'
    }, {
      prop: 'name',
      label: 'Name',
      width: '180'
    }, {
      prop: 'address',
      label: 'Address',
    },
  ]
})

function load(
  row: any,
  treeNode: unknown,
  resolve: (date: any[]) => void
) {
  setTimeout(() => {
    resolve([
      {
        id: 33,
        date: '2016-05-01',
        name: 'wangxiaohu',
        address: 'No. 189, Grove St, Los Angeles',
      },
      {
        id: 34,
        date: '2016-05-01',
        name: 'wangxiaohu',
        address: 'No. 189, Grove St, Los Angeles',
      },
    ])
  }, 1000)
}

onMounted(() => {
  console.log(RefTableGenerator.value());
})
</script>