IOS唤起键盘后--导致页面底部空白问题

场景：

在写微信项目的时候, 经常会遇到一些表单项。对于移动端项目，input（输入框）聚焦时，都会唤起设备键盘，内容输入完成，点击 “完成” 按钮，设备键盘消失，页面正常显示。

问题：

但在IOS 12.0版本----微信浏览器中常常会遇到：设备键盘消失后，当前页面底部大片空白问题，不能自动恢复整屏的页面显示。（如下图）

解决办法：

方案一：

• 修改布局方式：让最外层容器呈固定定位状态

position: fixed;
bottom: 0;

方案二：

• 让input失去焦点时，页面回到顶部即可，代码如下

template代码:

<input 
	type="text" 
	v-model="text"  
	@blur="onBlur" 
/>

js代码:

methods: {
	onBlur() {
      window.scrollTo(0, 0) // input失去焦点，让页面回顶部
    }
}

完美解决~