业务场景:antd的Tabs标签页组件,在Android机上面使用的时候,当移动端的软键盘搜索完收起时会出现一个空白处,底部内容被遮挡了,标签页组件的内容区域的高度不复原的问题,如图所示:
网上大多数的解决方案就是使用dom.scrollTop(x,y)方法,通过监听界面的resize事件或者输入框失去焦点事件,让被遮挡的dom滚动到底部或者顶部,但是并不适用我本次的问题。
我的解决办法是通过监听Andoid手机盘的软键盘收起事件,改Tabs组件绑定一个key值,然后动态的改变Tabs组件的Key(利用react的diff算法),让Tabs组件重绘
通过这种方法就可以解决我这个业务场景的问题
如果其他大佬有更好的解决方案,欢迎一起讨论。