vue之动态路由

关键词：路由

我们经常需要把某种模式匹配到的所有路由，全都映射到同个组件。例如，我们有一个 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
   });