从 Vue2 升级到 Vue3,很多语法和特性发生了改变,但是我们不 仅要知道写法上的不同,还要究其背后的原因。做到知其然,知其所以然。
我们在看到下面这些标题的时候,不妨先自己想想,然后再展开里面具体的原因分析,也帮你回顾下自己的知识掌握的是否全面。
1. 为什么 Vue2 组件中只能有一个根节点,而到了 Vue3 可以支持多个根节点?
其实本质上 Vue3 每个组件还是有一个根节点,因为 DOM 树只能是树状结构的,只是 Vue3 在编译阶段新增了判断,如果当前组件不只一个根元素,就添加一个 fragment
组件作为最外层组件将其
的包裹起来,相当于这个组件还是只有一个根节点。而 fragment
跟 keep-alive
一样是一个不会被渲染出来的内置组件。