首頁 > web前端 > js教程 > 使用Vue時瀏覽器後退無法觸發beforeRouteLeave的問題

使用Vue時瀏覽器後退無法觸發beforeRouteLeave的問題

亚连
發布: 2018-06-15 17:33:58
原創
4543 人瀏覽過

這篇文章主要介紹了解決Vue 瀏覽器後退無法觸發beforeRouteLeave的問題,需要的朋友可以參考下

現象

載入第一個元件(這裡的第一個意思是瀏覽器歷史記錄的第一個,後文稱為待監聽元件)時,正常跳轉其他頁面可以觸發beforeRouteLeave。但是 按瀏覽器的後退按鈕監聽不到該事件。

解決方案

目前採用較為土壤且不實用的解決方案。加一層組件,再router.push到 待監聽組件 ,使得 待監聽組件 非第一個組件,可以正常監聽beforeRouteLeave事件。

注意點:

由於打亂了原來的路由。需要在main.js中加入全域的路由監聽

router.beforeEach((to, from, next) => {
 if (to is '用于跳转的组件' && from is '待监听组件') {
  router.go(-1) 
  next(false)
 } else {
  next()
 }
 // 这样当从一个普通页面A进入待监听组件时,在待监听组件中按返回键时能正常进入A
})
登入後複製

上面是我整理給大家的,希望今後會對大家有幫助。

相關文章:

在JavaScript中有關的trick

#在webpack中實作動態引入檔案

在微信小程式中如何實作圓形進度條

在webpack中如何使用iconfont字體圖示

在webpack中如何單獨打包指定JS檔案

在vue行動端實現日期選擇元件

使用node實作內建偵錯

react webpack打包後的檔案(詳細教學)

JavaScript的6種正規表示式(詳細教學)

######## ##在javascript中如何實作填滿預設頭像############使用webpack打包處理bundle.js檔案過大的問題###########使用node.js實作抖音自動搶紅包功能############在vue-cli中如何設定babel設定檔############如何使用babel安裝設定教學### ###

以上是使用Vue時瀏覽器後退無法觸發beforeRouteLeave的問題的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板