midVue.js
What is Vue Router and how do you handle dynamic segments?
Updated May 4, 2026
Short answer
Vue Router is the official router; dynamic segments use colon syntax like /user/:id.
Deep explanation
Dynamic segments allow a route to match multiple URLs. The value is accessible via route.params. When navigating between routes with the same component but different params, the component is reused, requiring a watcher on the route or a key on <router-view> to refresh.
Real-world example
A social media app where the URL /profile/123 and /profile/456 use the same profile layout component.
Common mistakes
- Not reacting to parameter changes because the component is not re-mounted.
Follow-up questions
- How do you navigate programmatically?