解决 H5在android中 软键盘弹出打乱布局的问题（react解决）

一、问题描述

页面有个按钮固定/绝对定位最最底部，同页面有输入框，点击输入框软键盘弹出按钮被顶上去，仅出现在安卓系统，IOS没问题。

二、问题原因

查资料得知，安卓上的可视高度=我们看到的页面高度+软键盘的高度，而IOS的可视高度与软键盘无关

三、解决思路

监听该页面的可视高度，当高度小于原始高度，则将按钮隐藏，否则展示

四、React代码

var originHeight = document.documentElement.clientHeight || document.body.clientHeight;
export default class ProofAdd extends Component {
	state = {
		isButtonShow: true //默认按钮展示
	}
	 componentDidMount() {
	 	 // 在window对象中添加监听事件
         window.addEventListener('resize', this.resizeWindow)
	}

	resizeWindow = () => {
        var u = navigator.userAgent;
        //判断是否运行在安卓系统
        if(u.indexOf('Android') > -1 || u.indexOf('Adr') > -1){
            var resizeHeight = document.documentElement.clientHeight || document.body.clientHeight;
            //判断可视高度
            if (resizeHeight < originHeight) {
                // Android 键盘弹起后操作
                this.setState({
                    isButtonShow: false
                })
            } else {
                // Android 键盘收起后操作
                this.setState({
                    isButtonShow: true
                })
            }
        } 
    }
}
```

**** 按钮展示判断就不提供代码了~~~