<!-- 根组件：路由出口，带页面切换淡入淡出动画 -->
<template>
  <RouterView v-slot="{ Component }">
    <transition name="page-fade" mode="out-in">
      <component :is="Component" />
    </transition>
  </RouterView>
</template>

<style>
.page-fade-enter-active,
.page-fade-leave-active {
  transition: opacity 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.page-fade-enter-from,
.page-fade-leave-to {
  opacity: 0;
}
</style>
