mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-25 15:15:19 +00:00
docs: update examples of dynamic pageKey
(#22920)
This commit is contained in:
parent
2d46971162
commit
559a72370b
@ -205,7 +205,7 @@ If you want more control over when the `<NuxtPage>` component is re-rendered (fo
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<h1>I am the parent view</h1>
|
<h1>I am the parent view</h1>
|
||||||
<NuxtPage :page-key="someKey" />
|
<NuxtPage :page-key="route => route.fullPath" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
```
|
```
|
||||||
|
@ -34,6 +34,12 @@ For example, passing `static` key, `NuxtPage` component is rendered only once wh
|
|||||||
<NuxtPage page-key="static" />
|
<NuxtPage page-key="static" />
|
||||||
```
|
```
|
||||||
|
|
||||||
|
You can also use a dynamic key based on the current route. (Don't use `$route` object here as it can cause problems with how `<NuxtPage>` renders pages with `<Suspense>`.)
|
||||||
|
|
||||||
|
```html
|
||||||
|
<NuxtPage :page-key="route => route.fullPath" />
|
||||||
|
```
|
||||||
|
|
||||||
Alternatively, `pageKey` can be passed as a `key` value via `definePageMeta` from the `<script>` section of your Vue component in the `/pages` directory.
|
Alternatively, `pageKey` can be passed as a `key` value via `definePageMeta` from the `<script>` section of your Vue component in the `/pages` directory.
|
||||||
|
|
||||||
```js
|
```js
|
||||||
|
Loading…
Reference in New Issue
Block a user