uni-app 解决安卓端软键盘弹起布局错乱方案

当h5运行在安卓端的时候，点击input将会自动弹起软键盘，此时会将我们定位的元素向上挤，导致布局混乱，如下图

究其原因，是因为软键盘弹起的时候会将最外层的dom的高度缩小为可视窗口的大小

解决方案

加载页面的时候，记录下该设备可视区域大小，点击input的时候，强制将最外层dom为记录下来的可视区域大小即可

 

// html部分

<view class="root":style='"height: "+domHeight+"px;"'>

....

</view>

// data部分

domHeight: 0

// 点击input事件

Android() {
       var that = this
       setTimeout(function() {  // 加上延时会使页面看起来更流畅
              this.domHeight=document.documentElement.clientHeight
        },1000)
 }

// 记录下设备大小

mounted() {
            this.domHeight = document.documentElement.clientHeight
        }