当前位置： 移动技术网 > IT编程>移动开发>IOS > react-native 键盘遮挡输入框

react-native 键盘遮挡输入框

2019年08月09日  | 移动技术网IT编程  | 我要评论

行家看门道的下一句,找春天ppt,赵惟依资料

android上已经自动对键盘遮挡输入框做了处理，所以我们只需要关注ios。

1.首先引入 keyboardavoidingview

import { keyboardavoidingview } from 'react-native';

2.然后在页面的最外层加上 keyboardavoidingview

render(){
    return <keyboardavoidingview behavior={'padding'} style={{flex: 1}}>
        {/*具体页面内容*/}
    </keyboardavoidingview>
}

如果适配ios和android，可以将页面提取出来

    getpageview = () => {
        //return 具体页面内容
    }
    getplatformview = () => {
        if (platform.os === 'ios') {
            return <keyboardavoidingview behavior={'padding'} style={{flex: 1}}>
                    {this.getpageview()}
            </keyboardavoidingview>
        } else {
            return this.getpageview();
        }
    };

    render() {
        return this.getplatformview();
    }

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网