fix: 修复路由切换时过渡动画异常的问题 (#666)

Author: mokeyjay

src/App.vue

@@ -1,7 +1,7 @@
 <template>
   <t-config-provider :global-config="getComponentsLocale">
-    <router-view :key="locale" :class="[mode]"
-  /></t-config-provider>
+    <router-view :key="locale" :class="[mode]" />
+  </t-config-provider>
 </template>
 <script setup lang="ts">
 import { computed } from 'vue';

src/layouts/components/Content.vue

@@ -1,6 +1,6 @@
 <template>
   <router-view v-if="!isRefreshing" v-slot="{ Component }">
-    <transition name="fade">
+    <transition name="fade" mode="out-in">
       <keep-alive :include="aliveViews">
         <component :is="Component" />
       </keep-alive>
@@ -54,7 +54,7 @@ const isRefreshing = computed(() => {
   transition: opacity @anim-duration-slow @anim-time-fn-easing;
 }
 
-.fade-enter,
+.fade-enter-from,
 .fade-leave-to {
   opacity: 0;
 }