頁面跳轉與瀏覽器記錄

learn_shifeng 發布于2019-08-20 19:07 / 1033人閱讀

摘要：所以再做頁面跳轉的時候如果不想留下記錄，還是用比較保險，如果想留下記錄，應該幾百毫秒再跳轉。解決辦法先用給瀏覽器添加一條記錄，然后用的方法替換掉添加的記錄，這樣記錄里存的就是和解決方案

空	location.href = url	location.reload()	location.replace(url)
url完全不變的情況下	刷新Docment，不會產生記錄	刷新Docment，不會產生記錄	刷新Docment，不會產生記錄
只改變hash	不會刷新Docment，會在瀏覽器產生記錄,但是如果連續改變hash，也會丟失記錄是	空	不刷新Docment 也不產生記錄
改變url,只hash不算，hash從有到無算	刷新Document，會產生記錄，但是如果頁面加載時執行不會產生記錄，setTimeout里面執行就會有記錄	空	刷新Document，不會產生記錄

問題1：

在頁面加載的時候直接location.href 到其他的頁面，會在瀏覽器里不留下當前頁面的記錄，
試驗用 setTimeout 0秒后再location.href 到其他的頁面則會留下記錄。
所以再做頁面跳轉的時候如果不想留下記錄，還是用replace比較保險，如果想留下記錄，應該setTimeout幾百毫秒再跳轉。

問題2：

通過瀏覽器的前進和后退到頁面，頁面的Document會從緩存中取，js重新執行。所以如果頁面的數據是從模板中下發的，
會導致回退回來的時候頁面的模板數據不會刷新。
解決方案

var url = window.location.href;  
var ps = url.split("#");  
    try{  
        if(ps[1] != 1){  
            url += "#1";  
        }else{  
         //當訪問頁面的時候是有hash =1 證明是從別的url中過來的，所以replace成沒有hash的url(這里就會刷新Document)
          window.location.replace(ps[0]);  
          return;
        }  
    }catch(ex){  
        url += "#1";  
    }       
   //頁面第一次進來的時候，沒有hash = 1，用replace加上hash，這樣在跳轉到其他頁面再返回來的時候是帶著hash
    window.location.replace(url);

問題3：

頁面中當連續改變hash的時候，也會導致瀏覽器的歷史記錄會有丟失，所以快速切換hash也有問題。
但是有的需求是當進入頁面的時候需要立刻變成hash2，然后可以點擊返回到hash1，
如果從頁面中直接從hash1變成hash2會發現hash1的記錄消失。
解決辦法先用history.pushState 給瀏覽器添加一條記錄，然后用replace (hash2)的方法替換掉添加的記錄，這樣記錄里存的就是hash1和hash2
解決方案

history.pushState({},document.title, "#/order")
this.$router.replace({
      name: "Edit"
})

云服務器 GPU云服務器頁面跳轉 jsp不跳轉頁面跳轉刪除頁面記錄跳轉javaee頁面

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/85165.html

【Amaple教程】2. 模塊

摘要：模塊更新時部分不需被替換的模塊，檢測到或參數變化增加移除或修改參數時觸發，如所有頁面的部分總是不變，此時它將不會被替換。模塊函數將在模板指令與狀態數據中講解繼續學習下一節教程模板指令與狀態數據也可回顧上一節教程啟動路由正如它的名字，模塊用于amaplejs單頁應用的頁面分割，所有的跳轉更新和代碼編寫都是以模塊為單位的。定義一個模塊一個模塊由標簽對包含，內部分為template模板...

weizx 2019-08-01 18:27 評論0 收藏0
【Amaple教程】2. 模塊

摘要：模塊更新時部分不需被替換的模塊，檢測到或參數變化增加移除或修改參數時觸發，如所有頁面的部分總是不變，此時它將不會被替換。模塊函數將在模板指令與狀態數據中講解繼續學習下一節教程模板指令與狀態數據也可回顧上一節教程啟動路由正如它的名字，模塊用于amaplejs單頁應用的頁面分割，所有的跳轉更新和代碼編寫都是以模塊為單位的。定義一個模塊一個模塊由標簽對包含，內部分為template模板...

付倫 2019-08-22 13:59 評論0 收藏0
【Amaple教程】2. 模塊

摘要：模塊更新時部分不需被替換的模塊，檢測到或參數變化增加移除或修改參數時觸發，如所有頁面的部分總是不變，此時它將不會被替換。模塊函數將在模板指令與狀態數據中講解繼續學習下一節教程模板指令與狀態數據也可回顧上一節教程啟動路由正如它的名字，模塊用于amaplejs單頁應用的頁面分割，所有的跳轉更新和代碼編寫都是以模塊為單位的。定義一個模塊一個模塊由標簽對包含，內部分為template模板...

OBKoro1 2019-08-29 14:19 評論0 收藏0
微信小程序mpvue框架總結

摘要：原理架構作為與之間相互通信的橋梁部分在環境中注入的實現代碼，包含了協議的拼裝發送參數池回調池等一些基礎功能。部分在客戶端中的功能映射代碼，實現了攔截與解析環境信息的注入通用功能映射等功能。原理架構 JSBridge 作為native 與 JS 之間相互通信的橋梁JS部分(bridge): 在JS環境中注入 bridge 的實現代碼，包含了協議的拼裝/發送/參數池/回調池等一些基礎功能...

microelec 2019-08-23 18:32 評論0 收藏0