九、【Vue3】——新的组件（Fragment&Teleport&Suspense）

前言：Vue3更新了一些新的组件比较有亮点Fragment、Teleport、Suspense，还有一些其他变化。下面具体分析下如何炫酷的使用。

Fragment

• 在Vue2中: 组件必须有一个根标签
• 在Vue3中: 组件可以没有根标签, 内部会将多个标签包含在一个Fragment虚拟元素中
• 好处: 减少标签层级, 减小内存占用

  <template>
    <!-- Vue3组件模版结构中可以没有根标签，内部会将多个标签包裹在一个fragment虚拟元素中 -->
    <img alt="Vue logo" src="./assets/logo.png">
    <h1>Welcome to Your Vue.js App</h1>
    <h2>名称：{
      {name}}</h2>
    <h2>年龄：{
      {age}}</h2>
    <button @click="handleClick">点击</button>
    <button @click="test">测试vue2</button>
  </template>
  

T