Vuejs3 : 다음 Vue-router-next의 louer.js로 "transition"을 렌더링하려면 어떻게 해야 하는가?

Vuejs3 : 다음 Vue-router-next의 louer.js로 "transition"을 렌더링하려면 어떻게 해야 하는가?

나는 이렇게 하려고 했지만, "전환"이라는 꼬리표는 쓸모가 없다.

{
    path: 'PATH',
    name: 'NAME',
    component: {
      render() {
        return h('div', [h(resolveComponent('router-view'), {
          default: (props) => h(resolveComponent('transition'), {
            name: "fade-transform-vertical",
            mode: "out-in"
          }, {default: () => h(props.Component)})
        })]);
      }
    },
    meta: {title: 'A', icon: 'el-icon-discount'},
    children: [...]
  }

마지막으로, 다음을 포함하는 새 Vue 파일만 생성할 수 있음

<template>
  <div>
    <router-view v-slot="{ Component }">
      <transition name="fade-transform-vertical" mode="out-in">
        <keep-alive>
          <component :is="Component"/>
        </keep-alive>
      </transition>
    </router-view>
  </div>
</template>

나는 새로운 파일을 만들고 싶지 않다. 더 좋은 해결책이 있을까?

참조URL: https://stackoverflow.com/questions/69038565/vuejs3-how-can-i-render-transition-in-rouer-js-of-vue-router-next