我们经常需要把某种模式匹配到的所有路由,全都映射到同一个组件,例如,我们有一个User组件,对于所有ID各不相同的用户,都要使用这个组件来渲染,那么我们可以在vue-router的路由路径中使用动态路径参数(dynamic segment)来达到这个效果
foo bar
现在呢,像 /user/foo11 和 /user/bar11 都将映射到相同的路由。
你可以在一个路由中设置多段路径参数,对应的值都会设置到$route.params中,例如
模式 /user/:username 匹配路径 /user/evan $route.params {username:"evan"} 模式/user/:username/post/:post_id 匹配路径 /user/evan/post/123 $route.params {username:"evan",post_id:123} 除了$route.params外,$route对象还提供了其它有用的信息,例如,$route.query(如果URL中有查询参数)、$route.hash等等 响应路由参数的变化,提醒一下,当使用路由参数时,例如从/user/foo导航到user/bar,原来的组件实例会被复用,因为2个路由都渲染同一个组件,比起销毁再创建,复用则显得更加高效,不过,这也意味着组件的生命周期钩子不会再被调用,复用组件时,想对路由参数的变化做出响应的话,你可以简单的watch(监测变化)$route对象
foo bar
foo bar