所谓的Fragment,就是片段;在vue2.x中,要求每个模板必须有一个根节点,所以我们代码要这样写:

<template>
  <div>
    <span></span>
    <span></span>
  </div>
</template>

或者在Vue2.x中还可以引入vue-fragments库,用一个虚拟的fragment代替div;在React中,解决方法是通过的一个React.Fragment标签创建一个虚拟元素;在Vue3中我们可以直接不需要根节点:

<template>
    <span>hello</span>
    <span>world</span>
</template>

这样就少了很多没有意义的div元素。

更多推荐

Vue3.0的新特性(6)Fragment