目前路由的跳转是写死的，比如to="/user"，那就会跳到对应的组件；
现在我们的需求是，我访问 /user/123 或 /user/456 再或 /user/dao等等，都能跳到同一页面，并且把 /user后面的参数给带过来。这个实际就像学习springmvc时的restful风格一样；
分三步走：
1. to的属性值是可变的，后面跟的参数取决于data
<template> <div id="nav"> <router-link :to="‘/user/‘+userId">User</router-link> </div> <router-view/> </template> <script> export default { data(){ return { userId: ‘huya‘ } } }
2. 设置路由的映射规则，带占位符
const routes = [ { path: ‘/‘, name: ‘portal‘, redirect: ‘/home‘ }, { path: ‘/user/:userId‘, //占位符的名字是userId,在接收该参数时，参数名是有用的；如果访问的路径是/user，是匹配这个路由的，必须后面跟东西 name: ‘User‘, component: User } ]
3. 在跳转的组件中接收该参数
<template>
<div>
<h1>我是{{$route.params.userId}}</h1>
</div>
</template>
一个非常要注意的地方：$router和 $route 是两个完全不一样的东西。$router是我们的 new VueRouter，可在全部的组件进行使用；$route是当前的路由；比如说是User路由 来 跳转到 User组件的，那当前的路由就是User路由
原文：https://www.cnblogs.com/ibcdwx/p/14605555.html