Agent Skills
› NeverSight/learn-skills.dev
› vue-router-best-practices
vue-router-best-practices
GitHub提供Vue Router 4的最佳实践、常见陷阱及导航模式，涵盖路由守卫、生命周期交互及生产环境配置。
触发场景
Vue路由开发
前端导航逻辑实现
安装
npx skills add NeverSight/learn-skills.dev --skill vue-router-best-practices -g -y
SKILL.md
Frontmatter
{
"name": "vue-router-best-practices",
"author": "github.com\/vuejs-ai",
"license": "MIT",
"version": "1.0.0",
"description": "Vue Router 4 patterns, navigation guards, route params, and route-component lifecycle interactions."
}
Vue Router best practices, common gotchas, and navigation patterns.
Navigation Guards
- 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
Route Lifecycle
- Stale data when navigating between same route → See router-param-change-no-lifecycle
- Event listeners persisting after component unmounts → See router-simple-routing-cleanup
Setup
- Building production single-page application → See router-use-vue-router-for-production
版本历史
- e0220ca 当前 2026-07-05 20:29
