fix: remove nullish params when resolving (#1814)

NOTES: This change improves allows passing `null` or `undefined` to a param to completely drop. In practice, this should be better than casting it to an empty string but it should make no change if you check the absence of empty params with `!route.params.optional` rather than `route.params.optional !== ''` or any other stricter check. If you were doing stricter checks for optional params, make sure to change them to looser checks. Note that when resolving from the URL, optional parameters are always absent in the resolved object.

Author: skirtles-code

packages/router/__tests__/router.spec.ts

@@ -297,20 +297,25 @@ describe('Router', () => {
     expect(router.currentRoute.value).toMatchObject({ params: { p: '0' } })
   })
 
-  it('casts null/undefined params to empty strings', async () => {
+  it('removes null/undefined params', async () => {
     const { router } = await newRouter()
-    expect(
-      router.resolve({ name: 'optional', params: { p: undefined } })
-    ).toMatchObject({
-      params: {},
+
+    const route1 = router.resolve({
+      name: 'optional',
+      params: { p: undefined },
     })
-    expect(
-      router.resolve({ name: 'optional', params: { p: null } })
-    ).toMatchObject({
-      params: {},
+    expect(route1.path).toBe('/optional')
+    expect(route1.params).toEqual({})
+
+    const route2 = router.resolve({
+      name: 'optional',
+      params: { p: null },
     })
+    expect(route2.path).toBe('/optional')
+    expect(route2.params).toEqual({})
+
     await router.push({ name: 'optional', params: { p: null } })
-    expect(router.currentRoute.value).toMatchObject({ params: {} })
+    expect(router.currentRoute.value.params).toEqual({})
     await router.push({ name: 'optional', params: {} })
   })
 

packages/router/src/router.ts

@@ -491,7 +491,7 @@ export function createRouter(options: RouterOptions): Router {
       }
       // pass encoded values to the matcher, so it can produce encoded path and fullPath
       matcherLocation = assign({}, rawLocation, {
-        params: encodeParams(rawLocation.params),
+        params: encodeParams(targetParams),
       })
       // current location params are decoded, we need to encode them in case the
       // matcher merges the params