揭秘 Vue Router 动态路由：用变量匹配路径，按需展示页面内容！

Vue Router 动态路由是指在定义路由时，使用变量（用大括号 {} 包围）来匹配路径中的动态部分。这样，就可以根据不同的动态参数来显示不同的页面内容。 例如，我们可以定义一个路由如下： ```javascript { path: '/user/:id', component: User } ``` 在这个路由中，`:id` 是一个动态参数，它匹配路径中的任何字符序列。当用户访问 `/user/123` 这个路径时，Vue Router 会将 `123` 传递给 `User` 组件作为 `id` 属性。 我们可以在组件中通过 `this.$route.params` 来访问这个动态参数： ```javascript export default { data() { return { id: this.$route.params.id } } } ``` 这样，我们就可以根据不同的动态参数来显示不同的用户信息了。 ######[AI写代码神器 | 195点数解答 | 2023-11-09 01:31:35]