<router-view> can no longer be used directly inside <transition> or <keep-alive>

报警截图:

<router-view> can no longer be used directly inside <transition> or <keep-alive>_第1张图片

报警信息:

vue-router.mjs:35 [Vue Router warn]: <router-view> can no longer be used directly inside <transition> or <keep-alive>.
Use slot props instead:

<router-view v-slot="{ Component }">
  <transition>
    <component :is="Component" />
  </transition>
</router-view>

解决办法

照着浏览器提示,改一下就行

  <router-view v-slot="{ Component }">
    <transition name="el-zoom-in-top">
      <component :is="Component" />
    </transition>
  </router-view>

<router-view> can no longer be used directly inside <transition> or <keep-alive>_第2张图片

你可能感兴趣的:(前端)