開(kāi)發(fā)公眾號(hào)的時(shí)候，遇到ios下鍵盤收起，頁(yè)面顯示空白烘浦，底下的元素被遮擋抖坪。
效果如圖：
問(wèn)題圖片.png
發(fā)現(xiàn)問(wèn)題：
鍵盤收起的時(shí)候，內(nèi)容沒(méi)有回彈闷叉，并且有一塊空白遮擋了一部分元素
發(fā)現(xiàn)原因：
form元素都采用了fixed定位擦俐，底下還有提交按鈕同樣使用了fixed定位
解決問(wèn)題：
將fixed定位改換成absolute定位，解決了元素被遮擋的問(wèn)題握侧，
新的問(wèn)題產(chǎn)生蚯瞧，內(nèi)容不會(huì)回彈，需要手動(dòng)拉動(dòng)一下給body添加監(jiān)聽(tīng)事件品擎，當(dāng)檢測(cè)到鍵盤收起的時(shí)候埋合，設(shè)置top值，具體可參考下面代碼：
//這里監(jiān)聽(tīng)鍵盤收起萄传，然后滾動(dòng)頂部
document.body.addEventListener('focusout', () => {
//軟鍵盤收起的事件處理
let ua = navigator.userAgent.toLowerCase();
if (ua.indexOf('iphone') > 0 || ua.indexOf('ipad') > 0) {
//鍵盤收齊頁(yè)面空白問(wèn)題
document.body.scrollTop = document.body.scrollHeight;
}
})
結(jié)果：
將這段代碼加到vue的mounted中甚颂，親測(cè)有效。
最終效果圖：
最終效果圖.png
