vue关于router.replace历史路由问题记录

问题描述

A->B->C，C->B，在B中使用this.$router.go(-1),预期期望是返回到A页面，但是实际是又返回了C页面去了。

C页面提交通过this.$router.push跳转到B页面，在B页面使用go(-1)的话则会重新返回到C页面。

在网上查了下，提到的大多数解决方案都是使用this.$router.replace，即替换当前页面的方式，就不会生成历史记录。

通过验证，在C页面通过replace显示B页面后，然后再使用this.$router.go(-1)会发现，第一次没反应，再返回一次才是真的返回到了A页面。

通过进一步的观察发现，第一次点击其实并不是没有反应，而是页面返回到了首次的B页面。

这就是说，在C页面使用replace替换掉的是C页面的路由，C页面之前的B页面历史记录还存在。

解决方案：

后来通过使用keep-live和vuex的方式，结合this.$router.go(-1),让页面自动刷新的方式解决问题。参考这篇文章。