場景：判斷一個頁面有沒有上一頁，沒有就關閉頁面，有的話就返回上一頁

測試了多種方法后，最后用window.sesstionStorage 結合router.afterEach實現了。
我解決的思路：
1）用window.history.length，如果 =1則是關閉頁面，否則是返回上一頁。最后發現history.length只增不減，它只記錄你一共看了多少個頁面；放棄；
2）用document.referrer.它的值為url,當前頁面就是從這個 url 所代表的頁面跳轉或打開的.但是我發現我的項目中document.referrer都為’‘，原來單頁應用的document.referrer都為’'。這條路也走死了。

我發現現有的API不能解決這個問題，不能判斷這是不是打開的第一個頁面，有沒有上一頁這個問題。
關鍵來了
我的解決方法：
用sessionStorage記錄打開的第一個頁面的url，并結合后置全局導航守衛router.afterEach來實現：
具體步驟：

在入口js中配置一個router.afterEach，它是全局的后置鉤子函數，該函數會在每次路由切換成功進入激活階段時被調用。在觸發時（每次進入頁面時）判斷sessionStorage有沒有記錄firstUrl的值，沒有記錄說明是第一次進入頁面，就記錄，代碼如下：

router.afterEach((to, from) => {// 當頁面為打開的第一個頁面時，url添加進sessionStorageif (!window.sessionStorage.firstUrl) {window.sessionStorage.firstUrl = window.location.href} })

每個頁面點擊返回封裝為一個函數goBack，返回時判斷現在的url是否和sesstionStoraged 的firstUrl相等，(判斷整個url而不是只判斷路由名，因為可能因為參數不同實現的不同的業務邏輯哦) 它們相等則說明是第一個頁面。具體代碼如下:

goBack () {// 相等說明是首頁if (window.sessionStorage.firstUrl === window.location.href) {obj.closeWin() // 這里我是和原生交互的，closeWin可以直接關閉H5窗口} else {window.history.go(-1)}},

以上是手動點擊是返回，手勢返回也需要用同樣的邏輯，以下是手勢返回的代碼：

window.addEventListener("popstate", function(e) { goBack()}, false);

完啦，問題是不是解決啦？

總結

以上是生活随笔為你收集整理的vue单页项目中判断有没有上一页的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。