vue组件是什么样子的（vue组件为什么只能有一个根节点？）

vue2中只能有一个根标签
  
  
  
  
  
 ，但是在vue3中根组件已经可以有多个根节点了

在vue2中只所以这么做是因为vdom是一颗单根树形结构  
  
  
  
  
  ，patch方法在遍历的时候从根节点开始遍历
 


 


 


 


 


 

，它要求只有一个根节点
 
 
 
 
 
，组件也会转换为一个vdom,自然满足这个要求

vue3中值所以可以有多个节点   
   
   
   
   
   ，是因为引入了Fragment的概念
 

 

 

 

 

 
，这是一个抽象的节点

 

 

 

 

 

，如果发现组件有多个根            ，就创建一个Fragment节点
 
 

 
 

 
 

 
 

 
 

 
 ，把多个根节点作为它的children,将来path的时候











，如果发现是一个Fragement节点                 ，则直接遍历children创建或更新            。