共计 1309 个字符，预计需要花费 4 分钟才能阅读完成。
路由基本概念
route，它是一条路由。
{path: ‘/home’, component: Home}
routes，是一组路由。
const routes = [
{path: ‘/home’, component: Home},
{path: ‘/about’, component: About}
]
router 可以理解为一个容器，或者说一种机制，它管理了一组 route。简单来说，route 只是进行了 URL 和函数的映射，而在当接收到一个 URL 之后，去路由映射表中查找相应的函数，这个过程是由 router 来处理的。
const router = new VueRouter({
routes // routes: routes 的简写
})
VUE 中
$route 为当前 router 跳转对象里面可以获取 name、path、query、params 等。
$router 为 VueRouter 实例，想要导航到不同 URL，则使用 $router.push 方法，返回上一个 history 使用 $router.go 方法。跟上面说的一样，这里的 $router 就管理路由的跳转，英文里 er 结尾的都表示一种人，这里你可以把这个想象中一个管理者，他来控制路由去哪里（push、go），这样就比较容易记。
路由跳转
1 可以手写完整的 path：
this.$router.push({path:`/user/${userId}`})
这种方式需要在路由中作如下配置
{
path: ‘/user/:userId’,
name: ‘***’,
component: ***
}
这种接收参数的方式是 this.$route.params.userId。
2 也可以用 params 传递：
this.$router.push({name:’Login’,params:{id:’leelei’}})
// 不带参数 变成 ip/login
3 也可以用 query 传递：
this.$router.push({path:’/login’,query:{id:’leelei’})
// 带查询参数变成 ip/login?id=leelei
// 带斜杠 / 代表从根目录出发，不会嵌套之前的路径
query 传参是针对 path 的，params 传参是针对 name 的。。接收参数的方式都差不多。。this.$route.query. 和 this.$route.params.
注意这只是跳转 url，跳转到这个 url 显示什么组件，得配置路由。router 跳转和 <router-link> 标签跳转，规则差不多。
一些需要注意的事
使用 query 传参的话，会在浏览器的 url 栏看到传的参数类似于 get 请求，使用 params 传参的话则不会，类似于 post 请求。
如果提供了 path，params 将会被忽略（即如果要使用 params 传参，则一定要使用 name），但是 query 不属于这种情况。如果使用完整路径和 query 传参，刷新页面时不会造成路由传参的参数丢失。
router.push 和 router.replace 的区别是：replace 不会向 history 添加新记录，而是替换掉当前的 history 记录，即使用 replace 跳转到的网页‘后退’按钮不能点击。
最后
谢谢大家，如果有错误的地方请指出。
