[Vue] vue-router push/replace/go用法区别

Posted 2021-09-13 DiracKeeko

1.this.$router.push()
push跳转会向history栈添加一个记录，点击后退会返回到上一个页面。

A -> B ($router.push(“/c”))-> C
在C页面后退，会回到B页面。

2.this.$router.replace()
replace跳转不会向history里面添加新的记录，它是用页面C的地址replace了页面B的地址。在C页面后退，会跳转到B页面的上一个页面。

A -> B ($router.replace(“/c”))-> C
在C页面后退，会回到A页面。

3.this.$router.go(n)
相对于当前页面向前或向后跳转多少个页面,类似 window.history.go(n)。n可为正数可为负数也可以为0。
this.$router.go(0)刷新当前页面。
this.$router.go(3) // 前进 3 步记录
this.$router.go(n)===window.history.go(n)

注:
<router-link :to="/url">
等同于调用
router.push("/url")

<router-link to="/toPath" target="_blank"> </router-link> 支持新页面打开

同步发布于自己的语雀
https://www.yuque.com/diracke...