关键词:路由
我们经常需要把某种模式匹配到的所有路由,全都映射到同个组件。例如,我们有一个 User 组件,对于所有 ID 各不相同的用户,都要使用这个组件来渲染。那么,我们可以在 vue-router 的路由路径中使用『动态路径参数』(dynamic segment)来达到这个效果:
<div id="box">
<ul>
<router-link to="/user/way">方法</router-link>
<router-link to="/user/dir">目录</router-link>
</ul>
<router-view></router-view>
</div>
const User = {
template: `<div>User {{ $route.params.id }}</div>`
}
const router = new VueRouter({
routes: [
{ path: '/user/:id', component: User }
]
});
new Vue({
el:'#box',
router
});