Javascript Vue组件自身循环：未能装载组件：未定义模板或渲染函数

我好像没办法弄明白这个。 我有一个主包装器组件，它使用另一个组件来呈现导航结构

导航可以是多层次的，因此需要动态生成

包装器如下所示：

从“./Formats/LinkRole”导入LinkRole；
导出默认值{
组成部分：{
“链接角色”：链接角色，
},
道具：{
导航：{
类型：对象，
默认值：（）=>{return{}
}
}
}

和

LinkRole

组件，如下所示：

从“/LinkRole”导入LinkRole；
导出默认值{
组成部分：{
“链接角色”：链接角色，
},
道具：{
收藏：{
类型：[对象，数组]，
默认值：（）=>[]
}
},
}

正如您在

LinkRole

中所看到的，我在集合中的项目上循环，如果存在另一级别的

项目，则重复使用
LinkRole

通过这种方法，我得到了

[Vue warn]：未能装载组件：模板或呈现函数未加载
定义

但无法找出原因。
根据，您需要在组件中提供一个
名称
选项，以便能够递归使用它

组件可以在自己的模板中递归调用自己。但是，它们只能使用名称选项执行此操作

import LinkRole from './LinkRole';
export default {
    name: 'link-role',
    components: {
        'link-role': LinkRole,
    },
    props: {
        collection: {
            type: [Object, Array],
            default: () => []
        }
    },
}