1. 程式人生 > >vue關於router.replace歷史路由問題記錄

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),讓頁面自動重新整理的方式解決問題。