feat(nuxt): allow passing transition & keepalive props to <NuxtPage> (#7492)

This commit is contained in:
Daniel Roe 2022-09-14 11:34:16 +01:00 committed by GitHub
parent ee75b48526
commit 5d79ed5f9e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -1,4 +1,4 @@
import { computed, defineComponent, h, inject, provide, reactive, onMounted, nextTick, Suspense, Transition } from 'vue'
import { computed, defineComponent, h, inject, provide, reactive, onMounted, nextTick, Suspense, Transition, KeepAliveProps, TransitionProps } from 'vue'
import type { DefineComponent, VNode } from 'vue'
import { RouteLocationNormalized, RouteLocationNormalizedLoaded, RouterView } from 'vue-router'
import type { RouteLocation } from 'vue-router'
@ -18,6 +18,14 @@ export default defineComponent({
name: {
type: String
},
transition: {
type: [Boolean, Object] as any as () => boolean | TransitionProps,
default: undefined
},
keepalive: {
type: [Boolean, Object] as any as () => boolean | KeepAliveProps,
default: undefined
},
route: {
type: Object as () => RouteLocationNormalized
},
@ -38,10 +46,10 @@ export default defineComponent({
if (!routeProps.Component) { return }
const key = generateRouteKey(props.pageKey, routeProps)
const transitionProps = routeProps.route.meta.pageTransition ?? defaultPageTransition
const transitionProps = props.transition ?? routeProps.route.meta.pageTransition ?? (defaultPageTransition as TransitionProps)
return _wrapIf(Transition, transitionProps,
wrapInKeepAlive(routeProps.route.meta.keepalive ?? defaultKeepaliveConfig, isNested && nuxtApp.isHydrating
wrapInKeepAlive(props.keepalive ?? routeProps.route.meta.keepalive ?? (defaultKeepaliveConfig as KeepAliveProps), isNested && nuxtApp.isHydrating
// Include route children in parent suspense
? h(Component, { key, routeProps, pageKey: key, hasTransition: !!transitionProps } as {})
: h(Suspense, {