Vue中组件的递归使用方法

Vue组件是天然支持递归使用的，只需要在引用自己时使用跟该组件name相同的tag就行了，比如：

<template>
	<div>
		{{ item.name }}
		<template v-if="item.children">
			<tree-node v-for="child of item.children" :item="child"/>
		</template>
	<div>
</template>
<script>
	export default {
		name: 'TreeNode',
		......
	};
</script>

那么如果到这里就结束了就没意思了，我要说的是为什么Vue组件能支持递归使用呢，只要从源码级别上来分析。我这里用的源码的版本是2.5.21

我们定位到src\core\global-api\extend.js这个文件，在其中有这样一段代码

就是把组件自己又注册到了组件的components里了，就是这样

如果你觉得有帮助，请帮忙点赞哦:)