perf(export): keep page alive across route switches

This commit is contained in:
tisonhuang
2026-03-01 17:55:49 +08:00
parent 7604ff2ae4
commit a8eb0057e3
3 changed files with 29 additions and 2 deletions

View File

@@ -69,6 +69,19 @@
flex: 1;
overflow: auto;
padding: 24px;
position: relative;
}
.export-keepalive-page {
height: 100%;
&.hidden {
display: none;
}
}
.export-route-anchor {
display: none;
}
@keyframes appFadeIn {

View File

@@ -61,7 +61,9 @@ function App() {
const isVideoPlayerWindow = location.pathname === '/video-player-window'
const isChatHistoryWindow = location.pathname.startsWith('/chat-history/')
const isNotificationWindow = location.pathname === '/notification-window'
const isExportRoute = location.pathname === '/export'
const [themeHydrated, setThemeHydrated] = useState(false)
const [hasVisitedExport, setHasVisitedExport] = useState(isExportRoute)
// 锁定状态
// const [isLocked, setIsLocked] = useState(false) // Moved to store
@@ -99,6 +101,12 @@ function App() {
}
}, [isOnboardingWindow])
useEffect(() => {
if (isExportRoute) {
setHasVisitedExport(true)
}
}, [isExportRoute])
// 应用主题
useEffect(() => {
const mq = window.matchMedia('(prefers-color-scheme: dark)')
@@ -454,6 +462,12 @@ function App() {
<Sidebar />
<main className="content">
<RouteGuard>
{hasVisitedExport && (
<div className={`export-keepalive-page ${isExportRoute ? 'active' : 'hidden'}`} aria-hidden={!isExportRoute}>
<ExportPage />
</div>
)}
<Routes>
<Route path="/" element={<HomePage />} />
<Route path="/home" element={<HomePage />} />
@@ -468,7 +482,7 @@ function App() {
<Route path="/dual-report/view" element={<DualReportWindow />} />
<Route path="/settings" element={<SettingsPage />} />
<Route path="/export" element={<ExportPage />} />
<Route path="/export" element={<div className="export-route-anchor" aria-hidden="true" />} />
<Route path="/sns" element={<SnsPage />} />
<Route path="/contacts" element={<ContactsPage />} />
<Route path="/chat-history/:sessionId/:messageId" element={<ChatHistoryPage />} />

View File

@@ -1831,7 +1831,7 @@ function ExportPage() {
{!showInitialSkeleton && (isLoading || isSessionEnriching) && (
<div className="table-stage-hint">
<Loader2 size={14} className="spin" />
{isLoading ? '正在刷新会话列表…' : '正在补充头像和统计…'}
{isLoading ? '导出板块数据加载中…' : '正在补充头像和统计…'}
</div>
)}