Optional param casted automatically on routerLink even if we don't want optional param (when param is already set in url)

[JulienMalcouronne]

Hello I'm not sure this is a bug or perhaps there are wrong stuff in our codebase.

Once we set a param to be optional in the routes definition, the RouterLink :to={...route.name} without parameters in the code then the param is automatically set if we currently are on this route.

Is there a way to prevent that to happening?

Example:
for instance if I'm on the following route {name: dashboard, params: {id: 1}}

I have the following links ->

{name: dashboard} -> the first <a href="dashboard/1"> where it should be only /dashboard
{name: dashboard, params: {id: 2}}

We are using:
"vue-router": "^4.3.2",
"vue": "3.4.27",

[skirtles-code]

I attempted to reproduce the problem you're seeing based on the examples you gave, but it seemed to be working fine for me:

• Playground

I didn't really understand what you meant about RouterLink :to={...route.name}. Perhaps you wanted something like this?

<RouterLink :to="{ ...$route, params: {} }">

[posva]

I think you want to add what skirtles said: params: {}.

FYI: I can offer help over a call

[JulienMalcouronne]

I think you want to add what skirtles said: params: {}.

FYI: I can offer help over a call

Thanks a lot for your interest this might work in case I've got only one optional param, but what I did show you was the simplest example we've got.

I can't pass params: {} because in my scenario I need the orgId param. I want to provide something like this:

Well in my case I will simply change the first url to be the parent route and manage the redirection in beforeRouteUpdate but I really think there is something wrong in the router.resolve function related to nested routes optional params.

[JulienMalcouronne]

Also what you did suggest doesn't seem to work :(

I wish it would

[skirtles-code]

I can't really tell what I'm supposed to be looking at in those screenshots.

Perhaps this is what you're looking for?

https://router.vuejs.org/guide/essentials/navigation.html#Navigate-to-a-different-location

For optional params, you can provide an empty string ("") or null as the value to remove it.

[JulienMalcouronne]

Thanks a lot for your time found an acceptable workaround.

I don't have enough time for now on, but later next month I'll try to dig deeper in Vue-router source code to either open an issue or contribute to the project with a pull request to fix that error.

I still think there is an inheritance problem with optional params when we use the "name" props on RouterLink, that's a bit sad to do programmatic push while we could simply use a link.

About the screenshots, we can just see on the bottom left that the link's href is wrong (when we hover the link) despite the fact that the code looks okay (even your solution passing params: {}, or params: {orgId: null} wasn't successful).

But in all case I would like to thank you again for your time & investigation.