父组件:
<Tree :data="data"></Tree>
import Tree from "@/components/Tree.vue";
const data = reactive([
{
name: "1",
checked: true,
children: [
{
name: "1-1",
checked: false,
},
],
},)
子组件:
<template>
<div class="tree" v-for="item in data" :key="item.name">
<input v-model="item.checked" type="checkbox" />
<span>{{ item.name }}</span>
<Tree v-if="item?.children?.length" :data="item?.children"></Tree>
</div>
</template>
<script setup>
let props = defineProps({
data: Array,
});
</script>