vben 表格实现树结构懒加载

vben框架是在antD的基础上实现的，看了一下antD表格好像默认全部数据加载完才会实现树结构

于是直接结合vben的提供的api直接gogogo

<BasicTable @register="registerTable" :loading="loading" @expand="handleExpand">
    //~~~~~~~一些其他的
</BasicTable>

const loading = ref(false);

const [registerTable, { getDataSource, setTableData }] = useTable({
   //~~~~~~~一些其他的
});

onMounted(() => {
    getList();
});

async function getList() {
    try {
      loading.value = true;
      const res = await getRegionTree({ parentId: '0' });
      res?.map((item) => {
        item.children = [];
        return item;
      });
      setTableData(res);
    } finally {
      loading.value = false;
    }
  }

  async function handleExpand(expanded: boolean, record: ApiSysRegionItemModel) {
    console.log('expanded, record', expanded, record);
    if (!expanded) return;
    if (record.children?.length > 0) return;
    const id = record.id;
    const pList = getDataSource();
    const data = { parentId: id as string };
    try {
      loading.value = true;
      const res: any = await getRegionTree(data);
      let tableData = res || [];
      const dataMap = (items: any) => {
        items.find((item: any) => {
          if (item.id === id) {
            item.children = tableData;
            return item;
          }
          if (item.children?.length > 0) {
            dataMap(item.children);
          }
        });
      };
      dataMap(pList);
      setTableData([...pList]);
    } finally {
      loading.value = false;
    }
  }