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

<transition
  :name="!noTransition ? 'fade-transform' : ''"
  :mode="!noTransition ? 'out-in' : ''"
>
  <keep-alive :include="cachedViews">
    <router-view :key="key" />
  </keep-alive>
</transition>

[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 :key="key" v-slot="{ Component }">
  <transition
    :name="!noTransition ? 'fade-transform' : ''"
    :mode="!noTransition ? 'out-in' : ''"
  >
    <keep-alive :include="cachedViews">
      <component :is="Component"></component>
    </keep-alive>
  </transition>
</router-view>