Zengtudor/Nuxt
1
0
Fork 0
mirror of https://github.com/nuxt/nuxt.git synced 2024-11-11 00:23:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor(nuxt3): rename <NuxtChild> to <NuxtNestedPage> (#2432)

Browse Source
This commit is contained in:
Daniel Roe 2021-12-20 10:37:58 +00:00 committed by GitHub
parent f668d7457f
commit 639e49be27
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 10 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
docs/content/3.docs/2.directory-structure/9.pages.md
View File

@ -93,7 +93,7 @@ If you want to know more about `<RouterLink>`, read the [Vue Router documentati
## Nested Routes
We provide a semantic alias for `RouterView`, the `<NuxtChild>` component, for displaying the children components of a [nested route](https://next.router.vuejs.org/guide/essentials/nested-routes.html).
We provide a semantic alias for `RouterView`, the `<NuxtNestedPage>` component, for displaying the children components of a [nested route](https://next.router.vuejs.org/guide/essentials/nested-routes.html).
Example:
@ -123,13 +123,13 @@ This file tree will generate these routes:
]
```
To display the `child.vue` component, you have to insert the `<NuxtChild>` component inside `pages/parent.vue`:
To display the `child.vue` component, you have to insert the `<NuxtNestedPage>` component inside `pages/parent.vue`:
```html{}[pages/parent.vue]
<template>
<div>
<h1>I am the parent view</h1>
<NuxtChild :foobar="123" />
<NuxtNestedPage :foobar="123" />
</div>
</template>
```

2
examples/with-pages/pages/parent.vue
View File

@ -1,6 +1,6 @@
<template>
<div>
Parent
<NuxtChild />
<NuxtNestedPage />
</div>
</template>

2
packages/nuxt3/src/pages/runtime/child.vue → packages/nuxt3/src/pages/runtime/nested-page.vue
View File

@ -6,6 +6,6 @@
<script>
export default {
name: 'NuxtChild'
name: 'NuxtNestedPage'
}
</script>

8
packages/nuxt3/src/pages/runtime/router.ts
View File

@ -5,7 +5,7 @@ import {
createMemoryHistory,
RouterLink
} from 'vue-router'
import NuxtChild from './child.vue'
import NuxtNestedPage from './nested-page.vue'
import NuxtPage from './page.vue'
import NuxtLayout from './layout'
import { defineNuxtPlugin } from '#app'
@ -14,7 +14,7 @@ import routes from '#build/routes'
declare module 'vue' {
export interface GlobalComponents {
NuxtChild: typeof NuxtChild
NuxtNestedPage: typeof NuxtNestedPage
NuxtPage: typeof NuxtPage
NuxtLayout: typeof NuxtLayout
NuxtLink: typeof RouterLink
@ -22,10 +22,12 @@ declare module 'vue' {
}
export default defineNuxtPlugin((nuxtApp) => {
nuxtApp.vueApp.component('NuxtChild', NuxtChild)
nuxtApp.vueApp.component('NuxtNestedPage', NuxtNestedPage)
nuxtApp.vueApp.component('NuxtPage', NuxtPage)
nuxtApp.vueApp.component('NuxtLayout', NuxtLayout)
nuxtApp.vueApp.component('NuxtLink', RouterLink)
// TODO: remove before release - present for backwards compatibility & intentionally undocumented
nuxtApp.vueApp.component('NuxtChild', NuxtNestedPage)
const routerHistory = process.client
? createWebHistory()