feat: 为Frpc下载页面添加运行时缓存,避免重复请求触发限流

扩展路由元信息类型以支持页面缓存开关,在Layout中实现基于路由元的keep-alive逻辑,为Download组件设置对应名称和缓存标识,仅在应用运行时缓存页面,刷新仍需手动触发更新。
This commit is contained in:
Yuhang Wu
2026-10-16 13:44:20 +08:00
parent 5c1ce2fa5c
commit 57b4d7be5a
5 changed files with 73 additions and 3 deletions
+19 -1
View File
@@ -9,7 +9,12 @@
<Aside />
<main class="min-w-0 flex-1 overflow-hidden">
<router-view />
<!-- 按路由 meta.isCache 决定是否缓存页面组件(keep-alive 不持久化,仅在应用运行时生效) -->
<router-view v-slot="{ Component }">
<keep-alive :include="cachedViews">
<component :is="Component" />
</keep-alive>
</router-view>
</main>
</div>
@@ -31,6 +36,19 @@ import { useUpdateStore } from "@/stores/update"
const router = useRouter()
const updateStore = useUpdateStore()
/**
* 需要 keep-alive 缓存的页面组件名列表(由路由 meta.isCache 决定)。
*
* keep-alive 通过组件名匹配缓存,故约定:缓存页面的组件名需与路由 name 一致
* (页面通过 defineOptions({ name }) 显式声明)。
*/
const cachedViews = computed(() =>
router
.getRoutes()
.filter((record) => record.meta.isCache && record.name)
.map((record) => String(record.name)),
)
/** 点击标题栏“设置”按钮 → 跳转设置页 */
function goToSetting() {
router.push("/setting")