react-native 鍵盤遮擋輸入框

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();
    }