From ba62838b0832a79a4869baf2227d35382cfec3d8 Mon Sep 17 00:00:00 2001 From: Anthony Fu Date: Mon, 23 Mar 2026 16:41:46 +0900 Subject: [PATCH] fix: persist async data across tab navigation with custom getCachedData The imports tab (and other tabs) would show empty after navigation because Nuxt's purgeCachedData cleared the cached data on unmount. The default getCachedData only checks nuxtApp.static.data (empty in SPA mode), not payload.data where the actual fetch result is stored. By providing a custom getCachedData that reads from payload.data: 1. Data persists across unmount/remount cycles 2. Prevents clearNuxtDataByKey from running (line 459 of asyncData.js) 3. Pages render instantly with previous data instead of showing blank This fixes the empty imports/components/pages tabs on navigation back. Co-Authored-By: Claude Haiku 4.5 --- packages/devtools/client/composables/utils.ts | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/packages/devtools/client/composables/utils.ts b/packages/devtools/client/composables/utils.ts index b7d4076648..e9859f1c8a 100644 --- a/packages/devtools/client/composables/utils.ts +++ b/packages/devtools/client/composables/utils.ts @@ -80,12 +80,14 @@ export function parseReadablePath(path: string, root: string) { export function useAsyncState(key: string, fn: () => Promise, options?: AsyncDataOptions) { const nuxt = useNuxtApp() - - const unique = nuxt.payload.unique = nuxt.payload.unique || {} as any - if (!unique[key]) - unique[key] = useAsyncData(key, fn, options) - - return unique[key].data as Ref + const { data } = useAsyncData(key, fn, { + ...options, + // Custom getCachedData serves two purposes: + // 1. Returns previously fetched data from payload.data on remount, so pages render instantly + // 2. Prevents Nuxt's purgeCachedData from clearing data when the last consumer unmounts + getCachedData: key => nuxt.payload.data[key] as T, + }) + return data as Ref } export function getIsMacOS() {