前言
遇到了在输入框输入时底部按钮被虚拟键盘上去的问题,把解决办法分享一下
解决办法
文本通过监听页面高度的变化对按钮进行隐藏控制
代码实现
import React, {useState } from "react";
const BottomView = ({ children, ...props }: any) => {
const defaultPageHeight = document.documentElement.clientHeight;
const [isBtn, setIsBtn] = useState(true);
window.onresize = () => {
if (defaultPageHeight > document.documentElement.clientHeight) {
setIsBtn(false);
} else {
setIsBtn(true);
}
};
if (isBtn) {
return <div {...props}>{children}</div>;
}
return "";
};
export default BottomView;