mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-26 07:32:01 +00:00
fix(nuxt3): include route children in parent suspense (#4422)
This commit is contained in:
parent
ce38dcba1c
commit
7a316c289a
@ -1,10 +1,12 @@
|
|||||||
import { defineComponent, h, Suspense, Transition } from 'vue'
|
import { defineComponent, h, inject, provide, Suspense, Transition } from 'vue'
|
||||||
import { RouteLocationNormalizedLoaded, RouterView } from 'vue-router'
|
import { RouteLocationNormalizedLoaded, RouterView } from 'vue-router'
|
||||||
|
|
||||||
import { generateRouteKey, RouterViewSlotProps, wrapInKeepAlive } from './utils'
|
import { generateRouteKey, RouterViewSlotProps, wrapInKeepAlive } from './utils'
|
||||||
import { useNuxtApp } from '#app'
|
import { useNuxtApp } from '#app'
|
||||||
import { _wrapIf } from '#app/components/utils'
|
import { _wrapIf } from '#app/components/utils'
|
||||||
|
|
||||||
|
const isNestedKey = Symbol('isNested')
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
name: 'NuxtPage',
|
name: 'NuxtPage',
|
||||||
props: {
|
props: {
|
||||||
@ -16,14 +18,22 @@ export default defineComponent({
|
|||||||
setup (props) {
|
setup (props) {
|
||||||
const nuxtApp = useNuxtApp()
|
const nuxtApp = useNuxtApp()
|
||||||
|
|
||||||
|
const isNested = inject(isNestedKey, false)
|
||||||
|
provide(isNestedKey, true)
|
||||||
|
|
||||||
return () => {
|
return () => {
|
||||||
return h(RouterView, {}, {
|
return h(RouterView, {}, {
|
||||||
default: (routeProps: RouterViewSlotProps) => routeProps.Component &&
|
default: (routeProps: RouterViewSlotProps) => routeProps.Component &&
|
||||||
_wrapIf(Transition, routeProps.route.meta.pageTransition ?? defaultPageTransition,
|
_wrapIf(Transition, routeProps.route.meta.pageTransition ?? defaultPageTransition,
|
||||||
wrapInKeepAlive(routeProps.route.meta.keepalive, h(Suspense, {
|
wrapInKeepAlive(routeProps.route.meta.keepalive,
|
||||||
onPending: () => nuxtApp.callHook('page:start', routeProps.Component),
|
isNested
|
||||||
onResolve: () => nuxtApp.callHook('page:finish', routeProps.Component)
|
// Include route children in parent suspense
|
||||||
}, { default: () => h(routeProps.Component, { key: generateRouteKey(props.pageKey, routeProps) } as {}) }))).default()
|
? h(routeProps.Component, { key: generateRouteKey(props.pageKey, routeProps) } as {})
|
||||||
|
: h(Suspense, {
|
||||||
|
onPending: () => nuxtApp.callHook('page:start', routeProps.Component),
|
||||||
|
onResolve: () => nuxtApp.callHook('page:finish', routeProps.Component)
|
||||||
|
}, { default: () => h(routeProps.Component, { key: generateRouteKey(props.pageKey, routeProps) } as {}) })
|
||||||
|
)).default()
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user