框架選擇:習慣用VUE的話就選擇VUX吧,集成度高瘾带,文檔詳細等等鼠哥,都是優(yōu)點熟菲。
首先,既然是移動端頁面朴恳,第一個逃不過的坑就是頁面適配問題了抄罕。
1、大家可能第一想到的是rem單位于颖,貌似很多人認為這個單位是解決該問題萬能的呆贿,其實不是,這個方式并不是最好的方式森渐。
html{
font-size:625%
}
2做入、還有一種就是利用js動態(tài)給html和body加font-size
,大家一定想到的是lib-flexible這個庫了(不清楚的自己百度)同衣。這是個不錯的解決方案(配合第一種方式)竟块,之前淘寶也在用,不過現(xiàn)在基本可以放棄了耐齐。
3浪秘、最后一種,也是我現(xiàn)在用的埠况,可參考這篇文章耸携,說的已經非常詳細了。
說完適配這個坑辕翰,接著說說一些神奇的坑夺衍。
1、微信在進入后臺的時候金蜀,當你的頁面還打開著刷后,并且你的某些ajax請求是在這之后發(fā)起的,你可能要問什么樣的請求會在這個時候發(fā)起呢渊抄,舉個例子:
document.addEventListener('visibilitychange',async ()=>{
if (document.visibilityState === 'hidden') { //改為visible
this.$get('/api/...').then(res=>{ })
}
});
當有些操作是在你判斷頁面可見性的時候請求的尝胆,這時候ajax請求是不會成功的,用Pormise的時候回直接被catch到护桦,解決方法就是把請求放在document.visibilityState
為visible
的時候含衔,或者盡量避開這樣的設計。
2二庵、關于頁面后退不刷新問題贪染。
當你在頁面執(zhí)行history.back()
方法的時候,頁面是不會刷新的催享,如果想要刷新解決方式有很多杭隙,比如location.replace(document.referrer)
,方式百度一下就有很多因妙,可選擇你想要的一個就行痰憎。
3票髓、微信頁面存在獨有的瀏覽器api
第一次做微信公眾號頁面的時候還不知道有這個東西,直到產品經理說希望能實現(xiàn)點擊底部的返回按鈕(ios)的時候铣耘,能關閉頁面回到聊天界面洽沟。查了查資料發(fā)現(xiàn)啦辐,微信瀏覽器環(huán)境下有很多獨有的api哄孤。具體有哪些可以參考這個網址,當然有些可以通過jssdk實現(xiàn)酿傍。