问题描述

对于 ios 系统,输入框输入内容,软键盘弹出,页面内容整体上移,但是软键盘收起,页面内容不会自动回到原本的位置,必须手动下拉才会恢复

解决办法

compatibility(){
    let isReset = true;
    const u = navigator.userAgent;
    const isAndroid = us.indexOf('Android') > -1 || us.indexOf('Adr') > -1;
    let isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
    let originalHeight = document.documentElement.clientHeight || document.body.clientHeight;
    if(isAndroid) {
        window.onresize = function(){
            let resizeHeight = document.documentElement.clientHeight || document.body.clientHeight;
            if(resizeHeight < originalHeight){
                isReset = false;
            }else{
                isReset = true;
                setTimeout(() => {
                    if(isReset){
                        window.scroll(0,0)
                    }
                },300)
            }
        }
    }else if(isIOS){
        document.body.addEventListener('focusin', () => {
            isReset = false;
        })
        document.body.addEventListener('focusout', () => {
            isReset = true;
            setTimeout(() => {
                    if(isReset){
                        window.scroll(0,0)
                    }
                },300)
        })
    }
}

componentDidMount(){
    this.compatibility()
}
Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐