mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-22 13:45:18 +00:00
feat(nuxt): allow passing transition & keepalive props to <NuxtPage>
(#7492)
This commit is contained in:
parent
ee75b48526
commit
5d79ed5f9e
@ -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 type { DefineComponent, VNode } from 'vue'
|
||||||
import { RouteLocationNormalized, RouteLocationNormalizedLoaded, RouterView } from 'vue-router'
|
import { RouteLocationNormalized, RouteLocationNormalizedLoaded, RouterView } from 'vue-router'
|
||||||
import type { RouteLocation } from 'vue-router'
|
import type { RouteLocation } from 'vue-router'
|
||||||
@ -18,6 +18,14 @@ export default defineComponent({
|
|||||||
name: {
|
name: {
|
||||||
type: String
|
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: {
|
route: {
|
||||||
type: Object as () => RouteLocationNormalized
|
type: Object as () => RouteLocationNormalized
|
||||||
},
|
},
|
||||||
@ -38,10 +46,10 @@ export default defineComponent({
|
|||||||
if (!routeProps.Component) { return }
|
if (!routeProps.Component) { return }
|
||||||
|
|
||||||
const key = generateRouteKey(props.pageKey, routeProps)
|
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,
|
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
|
// Include route children in parent suspense
|
||||||
? h(Component, { key, routeProps, pageKey: key, hasTransition: !!transitionProps } as {})
|
? h(Component, { key, routeProps, pageKey: key, hasTransition: !!transitionProps } as {})
|
||||||
: h(Suspense, {
|
: h(Suspense, {
|
||||||
|
Loading…
Reference in New Issue
Block a user