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),让页面自动刷新的方式解决问题。

猜你喜欢

转载自blog.csdn.net/liangcha007/article/details/84767033