vue-router-best-practices — Skills

What it does

Navigating between same route with different params → See router-beforeenter-no-param-trigger

Accessing component instance in beforeRouteEnter guard → See router-beforerouteenter-no-this

Navigation guard making API calls without awaiting → See router-guard-async-await-pattern

Users trapped in infinite redirect loops → See router-navigation-guard-infinite-loop

Navigation guard using deprecated next() function → See router-navigation-guard-next-deprecated

Stale data when navigating between same route → See router-param-change-no-lifecycle

Event listeners persisting after component unmounts → See router-simple-routing-cleanup

vue router best practices

Source

Repository: https://github.com/vuejs-ai/skills

vue-router-best-practices FAQ

What does the vue-router-best-practices skill do?

Vue Router 4 patterns, navigation guards, route params, and route-component lifecycle interactions. Navigating between same route with different params → See router-beforeenter-no-param-trigger Accessing component instance in beforeRouteEnter guard → See router-beforerouteenter-no-this

How do I install vue-router-best-practices?

Run: npx -y skills add https://github.com/vuejs-ai/skills --skill vue-router-best-practices --agent claude-code — the source lives at github.com/vuejs-ai/skills.

Maintain vue-router-best-practices?

Let people know it's listed here — add the badge (live metrics, light/dark aware) or a plain link to your README or docs.

[![vue-router-best-practices on getagentictools](https://getagentictools.com/badge/skills/vuejs-ai-skills-vue-router-best-practices.svg)](https://getagentictools.com/skills/vuejs-ai-skills-vue-router-best-practices?ref=badge)

npx agentictools info skills/vuejs-ai-skills-vue-router-best-practices

The second line is the CLI lookup for this page — handy in READMEs and docs.