递归组件
递归 ：调用自身的编程 = 递归
需要给递归设置一个边界条件，用这个边界条件判断是否继续递归下去
如果不设置判断条件，将会无限递归，
递归组件 = 递归 + 组件
组件在边界条件内不断调用自己，直到超出边界条件为止
树组件 ， 左侧导航栏 ，多级表格（嵌套表格）
最开始前端并不知道这个导航有多少个层级
获取后端数据 ，在导航组件中设置递归边界，渲染数据
注册一个全局组件
<RootNav :list='navList'/>
在全局获取navList数据 ， 传递给组件
在组件中接收数据 props
const props = defineProps({
list: {
type:Array ,
default:()=>[]
}
})
//数据中children就是子菜单的意思
根据这个字段判断要不要继续递归 ，这个就是边界条件
<ul>
<template v-for='item in list'>
<li>{{item.name}}</li>
<RootNav :list='item.children' v-if='item.children.length > 0'/>
{/* 或者 v-if="'children' in item" */}
</template>
'children' in item 意思是item对象中是否有children属性