vue中的递归组件name的作用

<div class="container">
    <ul>
        <child-tree :list="comList" v-if="comList"></child-tree>
    </ul>
</div>
data(){
    return{
        comList:[
            {
                name:'第一层内容1',
                childArr:[
                    {
                        name:'地二层内容1'
                    },
                    {
                        name:'第二层内容2'
                    }
                ]
            },
            {
                name:'第一层内容2'
            },
            {
                name:'第一层内容2'
            }
        ]
    }
}
//子组件
<template>
    <div class="container">
       <li v-for="(item,index) in list" :key='index'>
           {{item.name}}
           <template v-if='item.childArr'>
               <ul>
                   <ChildTreeName :list="item.childArr">
               </ul>
           </template>
       </li>
    </div>
</template>
<script>
    name:'ChildTreeName',
    props:{
        list:{
            type:Array,
            default:[]
        }
    }
</script>

name:'ChildTreeName', /指组件自身组件调用自身组件/ 组件本身就是ChildTreeName，在调用时就不需要再用compents来声明了 @@组件的name值和router的name值是两个概念,两者没有关系