微信浏览器input关闭键盘后导致页面底部空缺问题解决方案

昨天遇到一个问题，移动端页面中有一个input框

点击时弹出软键盘，关闭时页面底部空白出一部分，然后滑动一下又恢复原状了。

这个问题是在部分ios手机里出现的，目前安卓手机没有复现。

这个问题是在ios12.0版本中出现的。

猜测：在微信webview打开我们h5页面的时候，就固定了页面的高度，如果这个input在页面的底部，当呼出软键盘时，由于高度问题，整个webview会被键盘顶上去，而取消时没有恢复原状。

 

解决办法：

绑定一个blur事件，当其触发时，使scrollTo为0

付代码如下：

          <input
            type="text"
            class="inputValue"
            v-model="teamCodeValue"
            @blur="inputBlur"
            placeholder="说明"
          >

    //对应的methods中添加js
    inputBlur () {
      window.scrollTo(0, 0)
    },

方可解决  亲测有效