這里先介紹一下導航守衛(wèi)

> beforeRouteEnter 離開路由之前執(zhí)行的函數(shù),可用于頁面的反向傳值，頁面跳轉
> beforeRouteLeave	進入路由之前執(zhí)行的函數(shù),寫在組件里可根據(jù)路由進行頁面判斷或傳值

history.pushState(stateObject, title, url);

history.pushState()主要是在不刷新瀏覽器的情況下，創(chuàng)建新的瀏覽記錄并插入瀏覽記錄隊列中。
1.狀態(tài)對象（stateObject）--stateObject是一個JavaScript對象，通過pushState方法可以將stateObject內容傳遞到新頁面中。
2.標題（title）--幾乎沒有瀏覽器支持該參數(shù)，但是傳一個空字符串會比較安全。
3.地址（url）--新的歷史記錄條目的地址（可選，不指定的話則為文檔當前URL）；瀏覽器在調用pushState()方法后不會加載該地址；傳入的URL與當前URL應該是同源的，否則，pushState()會拋出異常

data(){
return {
 replaceUrl:"" // 記錄你一開始進入的頁面
}	
},
// this還不能直接取到
beforeRouteEnter(to, from, next) {
 next(vm => {
 	 //因為當鉤子執(zhí)行前，組件實例還沒被創(chuàng)建
  // vm 就是當前組件的實例相當于上面的 this，所以在 next 方法里你就可以把 vm 當 this 來用了。
  console.log(vm);//當前組件的實例
  vm.replaceUrl = from.path;
 });
 },
 mounted() {
  // 掛載完成后，判斷瀏覽器是否支持popstate
  if (window.history && window.history.pushState) {
  history.pushState(null, null, document.URL);
  /*popstate觸發(fā)時機：當前歷史條目為pushState創(chuàng)建時，事件被觸發(fā)*/
  window.addEventListener('popstate', this.goRouteBack, false);
  }
 },
 methods: {
  goRouteBack(){
  // 需要過濾
	  let routerArray = [
	  "/shopOnline/establishOrder",
	  "/shopOnline/shopsuccess"
	  ];
	  if (routerArray.includes(this.replaceUrl)) {
	  //判斷，當獲取上個頁面進來的路由是D的時候，返回到A頁面
	  this.$router.replace({ path: "/shopOnline" });
	  } else {
	  this.$router.replace({ path: "/my" });
	  //判斷，當有其他返回值的時候，返回到默認頁面
	  }
		}
},
// 頁面銷毀時，取消監(jiān)聽。否則其他vue路由頁面也會被監(jiān)聽 這個必須得寫??！不然來回跳轉報錯
 destroyed(){
  window.removeEventListener('popstate', this.goRouteBack, false);
 }