在Vue.js中，vue-router是官方提供的路由管理器，用于构建单页面应用（SPA）。动态路由是vue-router中一个非常有用的功能，它允许你根据URL的某一部分动态地匹配到不同的路由。下面将介绍如何定义动态路由以及如何获取通过这些路由传递过来的值。
定义动态路由
在Vue Router中，你可以通过在路由路径中使用动态片段（dynamic segments）来定义动态路由。动态片段是以冒号开头的参数标记（例如：:id）。
示例：
const routes = [ { path: '/user/:id', component: User } ] const router = new VueRouter({ routes // （缩写）相当于 routes: routes })在这个例子中，/user/:id 定义了一个动态路由，其中 :id 是一个动态片段。当用户访问 /user/123 时，:id 会被替换为 123，并且 User 组件会被渲染。
获取传过来的值
在Vue组件中，你可以通过 $route.params 或 $route.query 来获取URL中传递的参数，但需要注意的是，对于动态路由参数（即路径中的参数），你应该使用 $route.params，而对于查询参数（即URL中?后面的参数），你应该使用 $route.query。然而，对于动态路由匹配到的参数，实际上是通过 $route.params 获取的，但这里的 $route.params 主要用于命名路由和星号路由（通配符路由），对于普通的动态路由参数，你应该使用 $route.params 下的特殊字段 $route.params.id（这里的 id 是你定义的动态片段的名称）。
但是，对于大多数情况，动态路由匹配到的参数会直接在 $route.params 下，但需要注意的是，这种参数并不会出现在 $route.params 的根级别，而是作为 $route.match.params 的一部分，并且由于Vue Router的自动处理，你通常可以直接通过 $route.params.yourParameterName 来访问（这里的 yourParameterName 是你定义的动态片段名，但在实际使用中，对于简单的动态路由，你可能只需要 $route.params.id 或其他你定义的名称）。
然而，在Vue Router 3.x及以后的版本中，对于使用 history 模式的动态路由，参数通常可以通过 $route.params 直接访问（如果路由是正确配置的），但更常见的是，对于通过 <router-link> 或编程式导航（如 router.push）访问的动态路由，其参数实际上是通过URL路径直接传递的，因此在组件内部，你不需要特别区分是查询参数还是动态路由参数，只需要知道如何访问这些参数即可。
在组件中获取动态路由参数：
export default { mounted() { // 假设你的路由是 /user/:id console.log(this.$route.params.id); // 这将输出匹配到的id值 }
}但请注意，如果你在使用 vue-router 的过程中没有遇到 $route.params.id 可用的情况（这可能是因为路由配置或Vue Router版本的问题），你可能需要查看你的路由配置，确保你已经正确地设置了动态路由，并且Vue Router的版本支持你的用法。在某些情况下，你可能需要使用 $route.match.params 来访问这些参数，但这通常不是必需的，除非你在处理一些特殊的路由情况。
