没有。

<template>
  <div></div>
  <div>~someone~</div>
</template>

是的，我知道

<template>
  <div>
  　　<div></div>
    ~someone~
  </div>
</template>

如果您没有在“Template”标签内使用“div”标签，您将得到相同的错误。（顺便说一下，可以使用除div标签之外的其他标签）

转换需要单个子节点，因此可以将<component>标记 Package 在<div>中，但是，<transition>中的普通<div>不会触发转换，但更改key属性会触发转换。
我们可以通过获取路由名称来获得唯一密钥：

<router-view v-slot="{ Component, route }">
  <transition name="fade" mode="out-in">
    <div :key="route.name">  
      <component :is="Component"></component>
    </div>
  </transition>
</router-view>

这将有效地在具有不同名称的路由之间进行转换，但是如果您还希望在具有不同参数的同名路由之间进行转换，则可以使用route.fullPath代替route.name作为key。

我不能完全相信这一点...但我也遇到了类似的问题，问题是我的视图中有多个节点，并发现了guy's post on the Vue.js forums：
我也发现了我的错误。过渡需要组件中的单个根节点！由于Vue 3不再需要组件的单个根节点，我认为这也适用于transitions。但这也是合乎逻辑的。CSS需要过渡可以引用的单个根节点。

当在具有相同标签名称的元素之间切换时，你必须通过赋予它们唯一的键属性来告诉Vue它们是不同的元素。否则，Vue的编译器只会为了效率而替换元素的内容。即使在技术上没有必要，在一个组件中总是键控多个项也被认为是一种好的做法。

<div>
  <router-link to="/"></router-link>
  <router-link to="/about"></router-link>
</div>
<router-view v-slot="{ Component, route }">
  <transition name="route" :key="route" mode="out-in">
    <component :is="Component" />
  </transition>
</router-view>

我解决了它，这是一个小错误，有一个字符外的html标签，直接在标签后（逗号）。

<template>,
    <div>
      <div>
        <swiper>
          <swiper-slide>Slide 1</swiper-slide>
          <swiper-slide>Slide 2</swiper-slide>
          <swiper-slide>Slide 3</swiper-slide>
        </swiper>
      </div>
    </div>
</template>

你动态组件示例必须有一个根元素。2在你的例子中，′ Swiper ′和′ SwiperSlide ′必须有一个根元素！

不要在路由器的component参数中使用RouterView.如果你需要那样做，把它放在根元素里面

<router-view v-slot="{ Component }">
 <transition name="fade" mode="out-in" appear>
  <!-- root element -->
  <div>
    <component :is="Component"></component>
  </div>
 </transition>
</router-view>

我使用Nuxt3的一个解决方案：
父页面为：

<template>
  <NuxtPage />
</template>

但也应该 Package 到根节点中：

<template>
  <div>
    <NuxtPage />
  </div>
</template>

否则我会得到一个过渡异常：
<Transition>内部的组件呈现无法设置动画的非元素根节点