fix(nuxt): extract component to provide route (#6325)

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)
+ }
+})