208 - 树组件

[mu-muw]

// 你的答案
```直接使用element组件
<template> 
  <el-tree :data="treeData" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
</template>
<script setup>
import { ref } from "vue";
const treeData = ref([{
  key: '1',
  title: 'Parent 1',
  children: [{
    key: '1-1',
    title: 'child 1',
  }, {
    key: '1-2',
    title: 'child 2',
    children: [{
      key: '1-2-1',
      title: 'grandchild 1',
    }, {
      key: '1-2-2',
      title: 'grandchild 2',
    },]
  },]
}, {
  key: '2',
  title: 'Parent 2',
  children: [{
    key: '2-1',
    title: 'child 1',
    children: [{
      key: '2-1-1',
      title: 'grandchild 1',
    }, {
      key: '2-1-2',
      title: 'grandchild 2',
    },]
  }, {
    key: '2-2',
    title: 'child 2',
  },]
}])
const defaultProps = {
 children: 'children',
 label: 'title'
};

const handleNodeClick = (data) => {
 console.log(data);
};
</script>



<!--

或者 Vue SFC Playground 在线链接 (https://sfc.vuejs.org)

-->