微信h5頁面返回時ios不重新整理頁面解決方案

2021-10-02 02:25:20 字數 962 閱讀 1541

解決這一問題想到了vue-router,vue-router不就是有路由鉤子嗎?它主要用的history的popstate/pushstate事件,具體的大家可以自行搜尋用法,其相容性可訪問下面位址檢視,基本大部分都可以支援

還有一種方式就是監聽pageshow和pagehide事件,但是相容性不太好,但我們可以作為當popstate不支援時的方案,萬一不支援popstate的手機支援pageshow呢

整理後的**如下

1.在跳轉的位置做處理

// 在調跳轉的時候呼叫replacestate,只有呼叫了replacestate或者pushstate的才會在返回時觸發popstate事件,使用pushstate會多乙個歷史記錄,所以使用replacestate

window.history.

replacestate(''

,'', location.href)

;// 在跳轉到你想去的頁面

window.location.href =

'***'

;

2.在頁面新增監聽事件

// 在當前頁面新增popstate監聽事件,popstate不支援的時候調pageshow和pagehideif(

supportspopstate()

));}

else})

; window.

addeventlistener

('pagehide',(

)=>);

}/**

* 判斷是否支援popstate事件

*/function

supportspopstate()

return window.history &&

'pushstate'

in window.history;

}

H5頁面微信分享

例如 標題 title 描述 自動獲取當前瀏覽頁的url 不可自定義,無法修改 縮圖 可以在父層 div 上設定 display none 或者對 img 設定 position absolute visibility hidden 例如 display none logo512.png alt d...

微信h5頁面製作總結

第 一 尺寸問題 設計圖的尺寸我剛開始要的是750 1334px,但是在實際應用中發現忽略了手機的狀態列和導航欄的高度 iphone的設計標準,狀態列和導航欄的獨立畫素高度分別為40px和88px android系統的可以更改狀態列和導航欄的高度,可以取預設值為48px和100px 所以設計元素的展...

實現H5頁面微信分享功能

官方是在title下邊引入 我是在body下面直接引用的,沒發現有什麼問題 script 接下來要配置config,我的是通過公司提供的js介面獲取的資訊,並且呼叫方法。var title 這裡面寫分享的名字 公司介面url location.href ajax.send ajax.onreadst...