mirror of
https://github.com/nuxt/nuxt.git
synced 2025-01-18 17:35:57 +00:00
perf(nuxt): use getters when constructing reactive routes (#21957)
This commit is contained in:
parent
d0dde6426f
commit
74c11dc662
@ -1,4 +1,4 @@
|
||||
import { computed, defineComponent, h, nextTick, onMounted, provide, reactive } from 'vue'
|
||||
import { defineComponent, h, nextTick, onMounted, provide, shallowReactive } from 'vue'
|
||||
import type { Ref, VNode } from 'vue'
|
||||
import type { RouteLocation, RouteLocationNormalizedLoaded } from '#vue-router'
|
||||
import { PageRouteSymbol } from '#app/components/injections'
|
||||
@ -28,10 +28,12 @@ export const RouteProvider = defineComponent({
|
||||
// Provide a reactive route within the page
|
||||
const route = {} as RouteLocation
|
||||
for (const key in props.route) {
|
||||
(route as any)[key] = computed(() => previousKey === props.renderKey ? props.route[key as keyof RouteLocationNormalizedLoaded] : previousRoute[key as keyof RouteLocationNormalizedLoaded])
|
||||
Object.defineProperty(route, key, {
|
||||
get: () => previousKey === props.renderKey ? props.route[key as keyof RouteLocationNormalizedLoaded] : previousRoute[key as keyof RouteLocationNormalizedLoaded]
|
||||
})
|
||||
}
|
||||
|
||||
provide(PageRouteSymbol, reactive(route))
|
||||
provide(PageRouteSymbol, shallowReactive(route))
|
||||
|
||||
let vnode: VNode
|
||||
if (process.dev && process.client && props.trackRootNodes) {
|
||||
|
@ -1,4 +1,4 @@
|
||||
import { computed, isReadonly, reactive, shallowRef } from 'vue'
|
||||
import { isReadonly, reactive, shallowReactive, shallowRef } from 'vue'
|
||||
import type { Ref } from 'vue'
|
||||
import type { RouteLocation, Router, RouterScrollBehavior } from '#vue-router'
|
||||
import {
|
||||
@ -108,10 +108,12 @@ const plugin: Plugin<{ router: Router }> = defineNuxtPlugin({
|
||||
// https://github.com/vuejs/router/blob/main/packages/router/src/router.ts#L1225-L1233
|
||||
const route = {} as RouteLocation
|
||||
for (const key in _route.value) {
|
||||
(route as any)[key] = computed(() => _route.value[key as keyof RouteLocation])
|
||||
Object.defineProperty(route, key, {
|
||||
get: () => _route.value[key as keyof RouteLocation]
|
||||
})
|
||||
}
|
||||
|
||||
nuxtApp._route = reactive(route)
|
||||
nuxtApp._route = shallowReactive(route)
|
||||
|
||||
nuxtApp._middleware = nuxtApp._middleware || {
|
||||
global: [],
|
||||
|
Loading…
Reference in New Issue
Block a user