fix: switch locale path loses query parameters (#46)

* fix: switch locale path loses query parameters

* chore: add explanation comment to `routeToObject` utility function

Author: BobbieGoede

packages/vue-i18n-routing/src/compatibles/routing.ts

@@ -5,7 +5,7 @@ import { isVue3, isRef, unref, isVue2 } from 'vue-demi'
 import { DEFAULT_DYNAMIC_PARAMS_KEY } from '../constants'
 import { getLocale, getLocaleRouteName, getRouteName } from '../utils'
 
-import { getI18nRoutingOptions, resolve } from './utils'
+import { getI18nRoutingOptions, resolve, routeToObject } from './utils'
 
 import type { RoutingProxy, PrefixableOptions, SwitchLocalePathIntercepter } from './types'
 import type { Strategies, I18nRoutingOptions } from '../types'
@@ -298,23 +298,24 @@ export function switchLocalePath(this: RoutingProxy, locale: Locale): string {
   const { switchLocalePathIntercepter, dynamicRouteParamsKey } = getI18nRoutingOptions(this.router, this)
 
   // prettier-ignore
-  const { params, ...routeCopy } = isVue3
+  const routeValue = isVue3
     ? (route as RouteLocationNormalizedLoaded) // for vue-router v4
     : isRef<Route>(route) // for vue-router v3
       ? route.value
       : route
+  const routeCopy = routeToObject(routeValue)
   const langSwitchParams = getLocalizableMetaFromDynamicParams(route, dynamicRouteParamsKey)[locale] || {}
 
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const _baseRoute: any = {
     name,
     params: {
-      ...params,
+      ...routeCopy.params,
       ...langSwitchParams
     }
   }
   if (isVue2) {
-    _baseRoute.params[0] = params.pathMatch
+    _baseRoute.params[0] = routeCopy.params.pathMatch
   }
 
   const baseRoute = assign({}, routeCopy, _baseRoute)

packages/vue-i18n-routing/src/compatibles/utils.ts

@@ -18,7 +18,7 @@ import type { RoutingProxy } from './types'
 import type { I18nRoutingGlobalOptions } from '../extends/router'
 import type { Strategies } from '../types'
 import type { Locale } from '@intlify/vue-i18n-bridge'
-import type { VueRouter, Router } from '@intlify/vue-router-bridge'
+import type { VueRouter, Router, Route, RouteLocationNormalizedLoaded } from '@intlify/vue-router-bridge'
 
 export function getI18nRoutingOptions(
   router: Router | VueRouter,
@@ -58,6 +58,26 @@ function split(str: string, index: number) {
   return result
 }
 
+/**
+ * NOTE:
+ * Nuxt route uses a proxy with getters for performance reasons (https://github.com/nuxt/nuxt/pull/21957).
+ * Spreading will result in an empty object, so we make a copy of the route by accessing each getter property by name.
+ */
+export function routeToObject(route: Route | RouteLocationNormalizedLoaded) {
+  const { fullPath, query, hash, name, path, params, meta, redirectedFrom, matched } = route
+  return {
+    fullPath,
+    params,
+    query,
+    hash,
+    name,
+    path,
+    meta,
+    matched,
+    redirectedFrom
+  }
+}
+
 /**
  * NOTE:
  * vue-router v4.x `router.resolve` for a non exists path will output a warning.