优化路由切换白屏问题

This commit is contained in:
gyq
2026-04-23 14:19:04 +08:00
parent 6d09813aa4
commit ffad9432c5

View File

@@ -3,7 +3,17 @@
<!-- 开启水印 -->
<el-watermark :font="{ color: fontColor }" :content="watermarkEnabled ? defaultSettings.watermarkContent : ''"
:z-index="9999" class="wh-full">
<router-view />
<!-- 🔴 修改开始使用 v-slot 处理路由组件 -->
<router-view v-slot="{ Component, route }">
<!--
1. 使用 <transition> 包裹防止渲染冲突
2. 加上 :key="route.path" 强制 Vue 在路由变化时重新渲染避免复用导致的空白
-->
<transition name="fade" mode="out-in">
<component :is="Component" :key="route.path" />
</transition>
</router-view>
<!-- 🟢 修改结束 -->
</el-watermark>
</el-config-provider>
</template>