fix(nuxt)!: remove `initialCache` option (#8885)

docs/content/3.api/1.composables/use-async-data.md

@@ -25,7 +25,6 @@ type AsyncDataOptions<DataT> = {
   transform?: (input: DataT) => DataT
   pick?: string[]
   watch?: WatchSource[]
-  initialCache?: boolean
   immediate?: boolean
 }
 
@@ -55,7 +54,6 @@ type AsyncData<DataT, ErrorT> = {
   * _transform_: a function that can be used to alter `handler` function result after resolving
   * _pick_: only pick specified keys in this array from the `handler` function result
   * _watch_: watch reactive sources to auto-refresh
-  * _initialCache_: When set to `false`, will skip payload cache for initial fetch. (defaults to `true`)
   * _immediate_: When set to `false`, will prevent the request from firing immediately. (defaults to `true`)
 
 Under the hood, `lazy: false` uses `<Suspense>` to block the loading of the route before the data has been fetched. Consider using `lazy: true` and implementing a loading state instead for a snappier user experience.

docs/content/3.api/1.composables/use-fetch.md

@@ -27,7 +27,6 @@ type UseFetchOptions = {
   transform?: (input: DataT) => DataT
   pick?: string[]
   watch?: WatchSource[]
-  initialCache?: boolean
 }
 
 type AsyncData<DataT> = {
@@ -60,7 +59,6 @@ All fetch options can be given a `computed` or `ref` value. These will be watche
   * `default`: A factory function to set the default value of the data, before the async function resolves - particularly useful with the `lazy: true` option.
   * `pick`: Only pick specified keys in this array from the `handler` function result.
   * `watch`: watch reactive sources to auto-refresh.
-  * `initialCache`: When set to `false`, will skip payload cache for initial fetch (defaults to `true`).
   * `transform`: A function that can be used to alter `handler` function result after resolving.
   * `immediate`: When set to `false`, will prevent the request from firing immediately. (defaults to `true`)
 

packages/nuxt/src/app/composables/asyncData.ts

@@ -29,7 +29,6 @@ export interface AsyncDataOptions<
   transform?: Transform
   pick?: PickKeys
   watch?: MultiWatchSources
-  initialCache?: boolean
   immediate?: boolean
 }
 
@@ -102,19 +101,19 @@ export function useAsyncData<
     console.warn('[useAsyncData] `defer` has been renamed to `lazy`. Support for `defer` will be removed in RC.')
   }
   options.lazy = options.lazy ?? (options as any).defer ?? false
-  options.initialCache = options.initialCache ?? true
   options.immediate = options.immediate ?? true
 
   // Setup nuxt instance payload
   const nuxt = useNuxtApp()
 
-  const useInitialCache = () => (nuxt.isHydrating || options.initialCache) && nuxt.payload.data[key] !== undefined
+  const getCachedData = () => nuxt.isHydrating ? nuxt.payload.data[key] : nuxt.static.data[key]
+  const hasCachedData = () => getCachedData() !== undefined
 
   // Create or use a shared asyncData entity
   if (!nuxt._asyncData[key]) {
     nuxt._asyncData[key] = {
-      data: ref(useInitialCache() ? nuxt.payload.data[key] : options.default?.() ?? null),
-      pending: ref(!useInitialCache()),
+      data: ref(getCachedData() ?? options.default?.() ?? null),
+      pending: ref(!hasCachedData()),
       error: ref(nuxt.payload._errors[key] ? createError(nuxt.payload._errors[key]) : null)
     }
   }
@@ -130,8 +129,8 @@ export function useAsyncData<
       (nuxt._asyncDataPromises[key] as any).cancelled = true
     }
     // Avoid fetching same key that is already fetched
-    if (opts._initial && useInitialCache()) {
-      return nuxt.payload.data[key]
+    if (opts._initial && hasCachedData()) {
+      return getCachedData()
     }
     asyncData.pending.value = true
     // TODO: Cancel previous promise
@@ -204,7 +203,7 @@ export function useAsyncData<
       }
     }
 
-    if (fetchOnServer && nuxt.isHydrating && key in nuxt.payload.data) {
+    if (fetchOnServer && nuxt.isHydrating && hasCachedData()) {
       // 1. Hydration (server: true): no fetch
       asyncData.pending.value = false
     } else if (instance && ((nuxt.payload.serverRendered && nuxt.isHydrating) || options.lazy) && options.immediate) {

packages/nuxt/src/app/composables/fetch.ts

@@ -68,7 +68,6 @@ export function useFetch<
     transform,
     pick,
     watch,
-    initialCache,
     immediate,
     ...fetchOptions
   } = opts
@@ -84,7 +83,6 @@ export function useFetch<
     default: defaultFn,
     transform,
     pick,
-    initialCache,
     immediate,
     watch: [
       _fetchOptions,

packages/nuxt/src/app/nuxt.ts

@@ -89,6 +89,9 @@ interface _NuxtApp {
     } | null
     [key: string]: any
   }
+  static: {
+    data: Record<string, any>
+  }
 
   provide: (name: string, value: any) => void
 }
@@ -118,6 +121,9 @@ export function createNuxtApp (options: CreateOptions) {
       _errors: {},
       ...(process.client ? window.__NUXT__ : { serverRendered: true })
     }),
+    static: {
+      data: {}
+    },
     isHydrating: process.client,
     deferHydration () {
       if (!nuxtApp.isHydrating) { return () => {} }

packages/nuxt/src/app/plugins/payload.client.ts

@@ -20,6 +20,6 @@ export default defineNuxtPlugin((nuxtApp) => {
     if (to.path === from.path) { return }
     const payload = await loadPayload(to.path)
     if (!payload) { return }
-    Object.assign(nuxtApp.payload.data, payload.data)
+    Object.assign(nuxtApp.static.data, payload.data)
   })
 })