1.报错[Vue warn]: Unknown custom element: <tree-folder-contents> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
found in
---> <TreeFolder>
<Root>
,
我的代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jjj</title>
</head>
<body>
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>
<script src="https://unpkg.com/vuex"></script>
<div id="example">
<tree-folder :folder="folder"></tree-folder>
</div>
<script type="text/javascript">
// 创建根实例
new Vue({
el: '#example',
data(){
return {
folder:{
name:'jjj',
children:[
{name:222},
{name:3333,children:[
{name:4444}
]}
]
}
}
},
components:{
treeFolder:{
template:`
<p>
<span>{{ folder.name }}</span>
<tree-folder-contents :children="folder.children"/>
</p>`,
props:['folder']
},
treeFolderContents:{
template:`
<ul>
<li v-for="child in children">
<tree-folder v-if="child.children" :folder="child"/>
<span v-else>{{ child.name }}</span>
</li>
</ul>`,
props:['children']
}
}
})
</script>
</body>
</html>
你没有把treeFolder这个组件注册到treeFolderContents内部