Error: Missing required param
Closed this issue · 2 comments
Reproduction
https://jsfiddle.net/w61ngh4b/26/
Steps to reproduce the bug
When navigating from a route with params (the current route) to one without params (the target route) sharing a common path prefix, in some constellations when computing activeRecordIndex.value
in the ComputeRef
isExactActive
fails. That resolves route.value
what fails at the end on return router.resolve(to)
, because to
is the current route without params. That results in an error Missing required param "..."
because that route requires params and will be matcher.stringify
'ed at some point.
The part I don't understand is how the current route makes it into useLink(props)
as props.to
, because the debugger fails me at that point.
The whole callstack bottom-up without reactivity:
finalizeNavigation
:currentRoute.value = toLocation;
. ThetoLocation
is the correct target route.isActive
:return link.value.isExactActive?.value && ...
isExactActive
:activeRecordIndex.value > -1 && ...
activeRecordIndex
:const { matched } = route.value;
route
:return router.resolve(to);
resolve
:const matchedRoute = matcher.resolve(matcherLocation, currentLocation);
resolve
:path = matcher.stringify(params);
stringify
: Error
Though I tried in the reproduction link, I failed to reproduce the issue. But I have a browser.log from our app that reliably throws that error.
Expected behavior
No errors. The params of the current route should be available in that logic, or the logic shouldn't be called at all.
Actual behavior
Error: Missing required param "..."
Additional information
"vue": "3.4.26",
"vue-router": "4.3.2",
"vuetify": "3.6.3",
...
While it could be a bug in Vue Router, it could also be a bug in Vue core or your application code. I've looked through the details you've provided, but I don't think it's going to be possible to fix this without a reproduction.
Thanks for caring! It was a bug in our breadcrumb implementation, so I will close this issue. Sorry for that.