element组件里的tree树形控件的使用？

<template>
  <el-tree :data="tableDatas" :props="defaultProps" node-key="id" @check="handleCheckChange" check-strictly
            :render-atfer-expand="false" show-checkbox check-on-click-node />
</template>

const tableDatas = ref([]);
const defaultProps = {
  children: 'children',
  label: 'title',
};
// 下拉框值
axios({
  url: '/fastapi/menu/index',
  params: {},
}).then(function (res) {
  console.log(res);
  tableDatas.value = getTree(res.data.data, 0, []);
  console.log(tableDatas.value);
});
//处理数据方法
function getTree(list, pid, data) {
  //获取所有一级
  for (let item of list) {
    if (item.pid == pid) {
      data.push(item);
    }
  }
  //获取子级
  for (let i of data) {
    i.children = [];
    getTree(list, i.id, i.children); //递归调用
    if (i.children.length == 0) {
      delete i.children;
    }
  }
  // console.log(data);
  return data;
}