vue-router中的replace和push

官方说明

vue的官方对路由的replace说明如下，但是看完表示并不理解，在实际项目中需要路由跳转的基本一律 用的push方法，今天特意做了一下实验验证replace到底和push的区别在哪里

举例说明

假设现在有有用户后台管理系统，有三个页面，登录页、列表页、详情页，逻辑如下：

1. 首先进入登录页，路由地址：http://localhost:8888#/login （假设路由名字叫login）
2. 登录成功，跳转到用户列表页面http://localhost:8888#/list （假设路由名字叫list）
3. 点击某一条用户信息，进入详情页面：http://localhost:8888#/detail?userId=235（假设路由名字叫detail）

现在登录系统查看某个用户详情，如果全部使用push，即路由跳转为login->list->detail，这时我们路由跳转后，我们点击浏览器的后退按钮是能一步一步的退回去的，从detail可以退到list，从list可以退到login。

如果从login到list用push，从list到detail用replace，此时在list页面时点击后退按钮，回到了login页面，然后从再从新登录，从login到list，再到detail，然后从详情页面再点击后退按钮，发现也是回到了login页面，而不是回到list，因为list没有被记录到history。

总结

replace和push的区别就是，replace在跳转之前不会把当前的路由路径记录到history，在replace跳转以后，再点击后退会回到更前面的一个路由页面。