为什么vue2 组件只能有一个根节点?

为什么vue2 组件只能有一个根节点?
只有一个根节点是为了解决什么问题?
vue3 中为什么可以有多个根节点?
vue3是如果处理之前vue2中template必须只有一个根节点的问题的?

Vue 2 的 Virtual DOM 机制是基于 Snabbdom 实现的。而引入 Virtual DOM(的目的之一)是为了提升渲染性能,这要靠 diff & patch 来实现。模板的灵活性相对于渲染性能被放到了次要的位置,因此 Vue 2 决定每个组件实例只对应一个 VNode 以提高 diff 效率。

Vue 3 完全重写了 Virtual DOM 机制,引入了其他机制来保证模板渲染性能,此时组件对应的 VNode 数量已经不是重要的问题,便自然支持了 Fragment(也就是多根节点)。