Vue中组件的递归使用方法

10/14 11:54
阅读数 20

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里了,就是这样

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

展开阅读全文
打赏
0
0 收藏
分享
加载中
更多评论
打赏
0 评论
0 收藏
0
分享
返回顶部
顶部