ModelTree.vue

<template>
  <div class="m-4 mr-0 overflow-hidden bg-white">
    <BasicTree
      ref="treeRef"
      treeWrapperClassName="h-[calc(100%-35px)] overflow-auto"
      :defaultExpandAll="true"
      :fieldNames="{ key: 'key', title: 'title' }"
      :treeData="taskTreeData"
      @select="handleSelect"
    />
  </div>
</template>
<script lang="ts" setup>
  import { nextTick, onMounted, ref, unref } from 'vue';
  import { BasicTree, TreeActionType, TreeItem } from '@/components/Tree';
  import { Nullable } from '@vben/types';
  import { taskTreeData } from './designData';

  defineOptions({ name: 'DeptTree' });

  const emit = defineEmits(['select']);

  const treeRef = ref<Nullable<TreeActionType>>(null);

  function handleSelect(keys) {
    emit('select', keys[0]);
  }
</script>