docs: add warning against layout as root element (#5345)

This commit is contained in:
Daniel Roe 2022-06-08 20:53:39 +01:00 committed by GitHub
parent 247deacc2b
commit 4e2dc037aa
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -102,11 +102,13 @@ Even if you are using the `~/pages` integration, you can take full control by us
```vue [pages/index.vue]
<template>
<NuxtLayout name="custom">
<template #header> Some header template content. </template>
<div>
<NuxtLayout name="custom">
<template #header> Some header template content. </template>
The rest of the page
</NuxtLayout>
The rest of the page
</NuxtLayout>
</div>
</template>
<script setup>
@ -118,6 +120,10 @@ definePageMeta({
::
::alert{type=warning}
If you use `<NuxtLayout>` within your pages, make sure it is not the root element (or disable layout/page transitions).
::
## Example: changing the layout
You can also use a ref or computed property for your layout.