TS throwing "missing param for named route..." when param is empty string and runtime error when is empty string

[VividLemon]

Version

3.6.5

Reproduction link

github.com

Steps to reproduce

1. Create a route with an optional param
2. Attempt to navigate to route with param explicitly undefined -- This works but throws TS issue
3. Attempt to then navigate using param as empty string -- This navigates to the page, but the URL does not change, (it actually goes to root I think), and in addition to this, it throws a TS error.

What is expected?

undefined is still an error, but empty string should work.

What is actually happening?

TS error, or runtime error.

When you do this.$router.push( { name: 'about', params: { id: undefined } } ). This works, but throws a TS error

When you do this.$router.push( { name: 'about', params: { id: '' } } ), this does NOT work, but throws no error.

It will "appear" as if it works (for the second) but will not actually change the URL, and will throw a console warn.

This issue does not occur for vue-router@4 & vue 3

(Kind of redundant) The actual issue was stemmed from this code:

this.$router.push({
  name: 'About', 
  params: {
    id: user?.id
  } 
})

^ This throws ts error

this.$router.push({
  name: 'About', 
  params: {
    id: user?.id ?? ''
  } 
})

^ This throws runtime error

My point on this last part is that I can't simply just remove the param statement, its dynamic.

[posva]

v3 is a bit stricter here but it could indeed handle it if the runtime already works. As a workaround, you can can try to omit the param:

params: user ? { id: user.id } : {} 

[Robert-Kovalcuk]

Hello is this issue still open to solve?