vue递归组件

父组件：

 
<script setup lang="ts">
import { reactive } from "vue";
import treeVue from "./tree.vue";
 
interface Tree {
  name: string,
  checked: boolean,
  children?: Tree[]
}
 
const treeData = reactive<Tree[]>([
  {
    name: "1",
    checked: false,
    children: [
      {
        name: "1-1",
        checked: false,
      },
      {
        name: "1-2",
        checked: true,
      },
    ],
  },
  {
    name: "2",
    checked: false,
  },
  {
    name: "3",
    checked: false,
    children: [
      {
        name: "3-1",
        checked: false,
        children: [
        {
            name: "3-1-1",
            checked: false,
        },
        {
            name: "3-1-2",
            checked: false,
        },
        ],
      },
      {
        name: "3-2",
        checked: false,
      },
    ],
  },
]);
script>
 
<style scoped>
style>

子组件：