React-图片背景被键盘挤压解决方案

场景复现

当背景使用background-image来设置时，Android中会出现如下事情：

什么情况，背景图怎么变小了？

是的，在Android中会存在这个问题，IOS中图片是不会被键盘挤压的。来看看解决办法吧。

解决办法

在界面初始化进来时，对设置背景层的容器进行高度设置，是的，需要动态设置容器高度来保证图片不会被挤压
这个问题是在开发React项目时发现的，所以一下会大概写出React中解决方案。

具体解决步骤

首先，在constructor中声明一个height。

constructor(props) {
    super(props);
    this.height = 0;
}
{% endhighlight%}

第二步，在对应容器中添加style的绑定

render() {
return (

);
}

第三步：在渲染前获取屏幕高度，并设置height的值

componentWillMount() {
this.height = window.screen.height;
}
`

大功告成，来看看最终效果吧