Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Active class not applied on RouterLink when using to with string or object with path key #2419

Open
alizadeh118 opened this issue Dec 8, 2024 · 1 comment
Labels
bug Something isn't working has workaround A workaround has been found to deal with the issue

Comments

@alizadeh118
Copy link

Reproduction

https://stackblitz.com/edit/vitejs-vite-a1m7gbnq

Steps to reproduce the bug

  1. Open the reproduction link
  2. Click on third item (Go to Feature one)
  3. Check the active classes applied to the first and second links.

Expected behavior

The RouterLink component with the /features value is expected to have the active class (router-link-active) applied when the current route is /features/one, regardless of how the to prop value is provided.

Actual behavior

The active class (router-link-active) is applied only when the to prop is passed with a route name. However, for another RouterLink where the to prop is provided as a string, the active class is not applied.

Additional information

There is another difference between these two RouterLink components, though I'm not sure if it's a bug:

<RouterLink :to="{ name: 'features' }">
<RouterLink to="/features">

Clicking only on the second link causes the $route.params to include a pathMatch key.
You can verify this by clicking on the first two links in the reproduction link.

@posva posva added bug Something isn't working has workaround A workaround has been found to deal with the issue labels Dec 8, 2024 — with Volta.net
@github-project-automation github-project-automation bot moved this to 🆕 Triaging in Vue Router Roadmap Dec 8, 2024
Copy link
Member

posva commented Dec 8, 2024

/features should probably resolve to an empty params too because of the optional instead of having the empty string.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working has workaround A workaround has been found to deal with the issue
Projects
Status: 🆕 Triaging
Development

No branches or pull requests

2 participants