From b91150d67c0bbd285d054aecef11a360b5cc43f2 Mon Sep 17 00:00:00 2001 From: Daniel Roe Date: Mon, 7 Feb 2022 10:17:28 +0000 Subject: [PATCH] docs: add `keepalive` docs (#3090) --- docs/content/3.docs/2.directory-structure/10.pages.md | 4 ++++ packages/nuxt3/src/pages/runtime/composables.ts | 6 +++--- 2 files changed, 7 insertions(+), 3 deletions(-) diff --git a/docs/content/3.docs/2.directory-structure/10.pages.md b/docs/content/3.docs/2.directory-structure/10.pages.md index 9420109b54..c35c582e3b 100644 --- a/docs/content/3.docs/2.directory-structure/10.pages.md +++ b/docs/content/3.docs/2.directory-structure/10.pages.md @@ -199,6 +199,10 @@ definePageMeta({ Of course, you are welcome to define metadata for your own use throughout your app. But some metadata defined with `definePageMeta` has a particular purpose: +#### `keepalive` + +Nuxt will automatically wrap your page in [the Vue `` component](https://vuejs.org/guide/built-ins/keep-alive.html#keepalive) if you set `keepalive: true` in your `definePageMeta`. This might be useful to do, for example, in a parent route which has dynamic child routes, if you want to preserve page state across route changes. You can also set props to be passed to ``. + #### `key` [See above](#child-route-keys). diff --git a/packages/nuxt3/src/pages/runtime/composables.ts b/packages/nuxt3/src/pages/runtime/composables.ts index 2072cf32e0..b0f9ba20cc 100644 --- a/packages/nuxt3/src/pages/runtime/composables.ts +++ b/packages/nuxt3/src/pages/runtime/composables.ts @@ -12,10 +12,10 @@ export const useRoute = () => { export interface PageMeta { [key: string]: any - pageTransition?: false | TransitionProps - layoutTransition?: false | TransitionProps + pageTransition?: boolean | TransitionProps + layoutTransition?: boolean | TransitionProps key?: string | ((route: RouteLocationNormalizedLoaded) => string) - keepalive?: false | KeepAliveProps + keepalive?: boolean | KeepAliveProps } declare module 'vue-router' {