API: The <nuxt> Component
This component is used only in layouts to display the page components.
Example (layouts/default.vue
):
<template>
<div>
<div>My nav bar</div>
<nuxt/>
<div>My footer</div>
</div>
</template>
To see an example, take a look at the layouts example.
Props:
- nuxtChildKey:
string
- This prop will be set to
<router-view/>
, useful to make transitions inside a dynamic page and different route. - Default:
$route.path
- This prop will be set to
There are 2 ways to handle internal key
prop of <router-view/>
.
nuxtChildKey
prop<template> <div> <nuxt :nuxt-child-key="someKey"/> </div> </template>
key
option in page components:string
orfunction
export default { key (route) { return route.fullPath } }
- name:
string
(introduced with Nuxt v2.4.0)- This prop will be set to
<router-view/>
, used to render named-view of page component. - Default:
default
- This prop will be set to
To see an example, take a look at the named-views example.
← watchQuery nuxt-child →