路由跳转成功，但子路由页面不显示

[Vinsurs]

⚠️ 重要 ⚠️ 在进一步操作之前，请检查下列选项。如果您忽视此模板或者没有提供关键信息，您的 Issue 将直接被关闭

• [ √] 已阅读 文档.
• [ √] 确保您的代码已是最新或者所报告的 Bug 在最新版本中可以重现. (部分 Bug 可能已经在最近的代码中修复)
• [ √] 已在 Issues 中搜索了相关的关键词
• [ √] 不是 ant design vue 组件库的 Bug

描述 Bug

二级路由使用的默认vben魔板的transition包裹，从课程列表页面点击进入课程详情页显示正常，但是在课程详情页面通过返回按钮返回（replace 到列表页面）时，路由切换是fullfilled，但是列表页面不显示内容。

复现 Bug

vben魔板的二级路由(/src/layout/page/index.vue):

<template>
  <RouterView>
    <template #default="{ Component, route }">
      <transition
        :name="
          getTransitionName({
            route,
            openCache,
            enableTransition: getEnableTransition,
            cacheTabs: getCaches,
            def: getBasicTransition,
          })
        "
        mode="out-in"
        appear
      >
        <keep-alive v-if="openCache" :include="getCaches">
          <component :is="Component" :key="route.fullPath" />
        </keep-alive>
        <component v-else :is="Component" :key="route.fullPath" />
      </transition>
    </template>
  </RouterView>
  <FrameLayout v-if="getCanEmbedIFramePage" />
</template>

下面是路由表配置：

import type { AppRouteModule } from '/@/router/types';
import { LAYOUT } from '/@/router/constant';

const contentManage: AppRouteModule = {
  path: '/content-manage',
  name: 'ContentManage',
  component: LAYOUT,
  redirect: '/content-manage/course',
  meta: {
    icon: 'ion:grid-outline',
    title: '内容管理',
  },
  children: [
    {
      path: 'course',
      name: 'CourseManagePage',
      component: () => import('/@/views/services/content-manage/course/index.vue'),
      meta: {
        title: '课程管理',
      },
    },
    {
      path: 'course/create/:id?',
      name: 'CourseCreatePage',
      component: () => import('/@/views/services/content-manage/course/create.vue'),
      meta: {
        title: '创建课程',
        currentActiveMenu: '/content-manage/course',
        hideMenu: true,
      },
    },
]
};
export default contentManage;

下面是详情页的返回按钮的handler:

//返回
const { replace } = useRouter();
function handleGoBack() {
  replace({ name: 'CourseManagePage' });
}

点击触发上面的返回，路由地址是变了，但是页面不显示内容. 奇怪的是当把<transition>组件去了，单纯的用<router-view></router-view>却是正常的。说明一下，路由组件都是有用外层div元素包裹的 求解.

系统信息

• 操作系统:window 10
• Node 版本: v16.12.0
• 包管理器 (npm/yarn/pnpm) 及其版本: yarn: 1.x

[Vinsurs]

打扰了