diff --git a/packages/nuxt/src/pages/runtime/page.ts b/packages/nuxt/src/pages/runtime/page.ts index ffd653097f8..f46a34a593e 100644 --- a/packages/nuxt/src/pages/runtime/page.ts +++ b/packages/nuxt/src/pages/runtime/page.ts @@ -33,23 +33,14 @@ export default defineComponent({ default: (routeProps: RouterViewSlotProps) => { if (!routeProps.Component) { return } - const Component = defineComponent({ - setup () { - provide('_route', routeProps.route) - return () => h(routeProps.Component, { - key: generateRouteKey(props.pageKey, routeProps) - } as {}) - } - }) - return _wrapIf(Transition, routeProps.route.meta.pageTransition ?? defaultPageTransition, wrapInKeepAlive(routeProps.route.meta.keepalive, isNested && nuxtApp.isHydrating // Include route children in parent suspense - ? h(Component) + ? h(Component, { key: generateRouteKey(props.pageKey, routeProps), routeProps } as {}) : h(Suspense, { onPending: () => nuxtApp.callHook('page:start', routeProps.Component), onResolve: () => nuxtApp.callHook('page:finish', routeProps.Component) - }, { default: () => h(Component) }) + }, { default: () => h(Component, { key: generateRouteKey(props.pageKey, routeProps), routeProps } as {}) }) )).default() } }) @@ -63,3 +54,11 @@ export default defineComponent({ }> const defaultPageTransition = { name: 'page', mode: 'out-in' } + +const Component = defineComponent({ + props: ['routeProps'], + setup (props) { + provide('_route', props.routeProps.route) + return () => h(props.routeProps.Component) + } +})