bug復現

情況說明：

在2018.11.30號一個明媚的下午，測試跟我反饋說ios出現了bug，懷著一定是你姿勢不對的心裡我自己悄悄的點了一下，我去，居然也出現了，可是昨天還沒有啊，開始排查程式碼，發現沒有任何問題，於是用其他版本的ios和微信測試，發現只有在ios12+，微信6.7.4版本才有，然後又看了一下微信6.7.4也是剛更新，為了在驗證一下是不是自己的程式碼問題，於是打開了之前寫的專案和自己寫了一個靜態的html都復現了該bug，所以就很開心的定位到了問題(此時臉上笑嘻嘻)。

上效果圖：

使用者進行使用者名稱的輸入，然後點選完成按鈕

此時一個很神奇的底邊出現了，這種還好，只是樣式出現了問題，醜是醜了點還是可以使用的，但是如果底部使用了fixed佈局，那就比較鬱悶不光醜，而且按鈕還不可以點選，因為位置發生了變化，他停留在了被fixed頂到的那個位置。

解決方案

本文目前提供了一種解決方案雖然可能不是最好的，但是目前能夠有效的規避該問題。

解決思路：

復現該bug以後發現只要滾動一下頁面就可以使頁面恢復正常，於是就想可不可以在input失去焦點以後呼叫一下頁面滾動，來完成該操作，發現果然可以。然後就產生了如下程式碼

上程式碼：

   temporaryRepair(){
    var currentPosition,timer;
    var speed=1;//頁面滾動距離
    timer=setInterval(function(){
        currentPosition=document.documentElement.scrollTop || document.body.scrollTop;
        currentPosition-=speed; 
        window.scrollTo(0,currentPosition);//頁面向上滾動
        currentPosition+=speed; //speed變數
        window.scrollTo(0,currentPosition);//頁面向下滾動
        clearInterval(timer);
    },1);
}
 

在該程式碼基礎上增加了一些簡單邏輯，判斷是否為ios系統和是否為微信6.7.4版本。
程式碼：

var wechatInfo = navigator.userAgent.match(/MicroMessenger\/([\d\.]+)/i);
var wechatVersion = wechatInfo[1] 
var u = navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
if(wechatVersion=='6.7.4'&&!!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)){
...程式碼邏輯
}
 

如果大家 有更好的解決方案歡迎討論。
如果方法可以使用給個贊吧。。。