成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

關(guān)于APP內(nèi)嵌H5后退按鈕問題

phoenixsky / 1733人閱讀

摘要:最近都在用做內(nèi)嵌頁面,在點擊后退時如果在路由中跳轉(zhuǎn)過多次點后退會后退很多次才能退出頁面用戶體驗很差。同時,這些方法會和事件一起工作。

最近都在用vue做APP內(nèi)嵌H5頁面,在APP點擊后退時如果在路由中跳轉(zhuǎn)過多次 點后退會后退很多次才能退出頁面 用戶體驗很差。

下面來說下解決方法
因為hisotry模式官方說需要服務(wù)器配置所以路由一直在用hash模式,針對這一需求需要了解h5新加的history模式

H5引入了history.pushState()和history.replaceState()這兩個方法,他們允許添加和修改history實體。同時,這些方法會和window.onpostate事件一起工作。

pushState方法用一個新的url取代當(dāng)前頁面的url并把當(dāng)前頁面的url存進歷史記錄,

replaceState只用新url取代當(dāng)前頁面的url,但是不把當(dāng)前頁面的url存進歷史記錄

pushState()有三個參數(shù):state對象,標題字符串(現(xiàn)在沒有瀏覽器支持),URL字符串(可選,如果為空,設(shè)置為當(dāng)前頁面的url)

只有前進后退可以觸發(fā)popstate事件,對于不是通過pushState,replaceState兩個方法產(chǎn)生的url,state對象為空
所以首先監(jiān)聽一下popstate事件在監(jiān)聽事件里直接調(diào)回退的方法

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

這樣就可以直接退出當(dāng)前頁面了

還要history在服務(wù)器端渲染不出來的問題 前端其實也可以用一種笨方法解決的

把你服務(wù)器的地址直接卸載路由里,根路徑要把你頁面的名字帶上,就像這樣

因為在APP里所以也不存在刷新頁面找不到的問題,就不需要服務(wù)端來幫忙啦~
希望可以幫到有類似需求的小伙伴,有更好的方法的大神也來指導(dǎo)下

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/91817.html

相關(guān)文章

  • 「前端早讀君009」快速小程序開發(fā)之微信小程序內(nèi)嵌 H5

    摘要:前言微信小程序中可以直接運行頁面,這一新組件的產(chǎn)生,可能直接導(dǎo)致小程序數(shù)量迎來一波高峰。微信小程序配置系列問題配置域名業(yè)務(wù)域名中配置的就是小程序以及和中引用的域名。 今日勵志語 要接受自己行動所帶來的責(zé)任而非自己成就所帶來的榮耀。 前言 微信小程序中可以直接運行 web 頁面,這一新組件 web-view 的產(chǎn)生,可能直接導(dǎo)致小程序數(shù)量迎來一波高峰。本篇博文將從業(yè)務(wù)選型,微信小程序后臺...

    wh469012917 評論0 收藏0
  • H5實例教學(xué)--微信內(nèi)嵌視頻1(案例淺析)

    摘要:但好在中,新增了屬性,可以使視頻內(nèi)聯(lián)播放。以上為該案例主要需要解決的問題。補充資料視頻播放優(yōu)化 showImg(https://segmentfault.com/img/bVJCVu?w=133&h=136); 以上為案例二維碼 首個H5案例解析 從頭開始分析 在 iOS 上,APP 都是使用的系統(tǒng)自帶的瀏覽器進行頁面渲染,video 播放視頻的效果是統(tǒng)一的,只需要考慮不同的 iOS ...

    quietin 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<