mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-16 10:54:49 +00:00
28 lines
1.0 KiB
TypeScript
28 lines
1.0 KiB
TypeScript
import { defineComponent, h, Suspense, Transition } from 'vue'
|
|
import { RouterView } from 'vue-router'
|
|
import { wrapIf, wrapInKeepAlive } from './utils'
|
|
import { useNuxtApp } from '#app'
|
|
|
|
type InstanceOf<T> = T extends new (...args: any[]) => infer R ? R : never
|
|
type RouterViewSlotProps = Parameters<InstanceOf<typeof RouterView>['$slots']['default']>[0]
|
|
|
|
export default defineComponent({
|
|
name: 'NuxtPage',
|
|
setup () {
|
|
const nuxtApp = useNuxtApp()
|
|
|
|
return () => {
|
|
return h(RouterView, {}, {
|
|
default: ({ Component, route }: RouterViewSlotProps) => Component &&
|
|
wrapIf(Transition, route.meta.pageTransition ?? defaultPageTransition,
|
|
wrapInKeepAlive(route.meta.keepalive, h(Suspense, {
|
|
onPending: () => nuxtApp.callHook('page:start', Component),
|
|
onResolve: () => nuxtApp.callHook('page:finish', Component)
|
|
}, { default: () => h(Component) }))).default()
|
|
})
|
|
}
|
|
}
|
|
})
|
|
|
|
const defaultPageTransition = { name: 'page', mode: 'out-in' }
|