React native 在react native中导航时检测键盘打开模式

React native 在react native中导航时检测键盘打开模式,react-native,React Native,在react本机应用程序的注册过程中,我必须从电子邮件屏幕导航到密码屏幕等。当我从电子邮件屏幕单击下一步时,当我转到密码屏幕时,键盘仍然打开。导航到新屏幕时,如何检测键盘是否打开 一旦进入密码屏幕,键盘侦听器就会正常工作。这是我的密码。唯一的问题是,当屏幕加载时,我无法检测键盘状态 constructor(props) { super(props); this.state = { email: { val

在react本机应用程序的注册过程中,我必须从电子邮件屏幕导航到密码屏幕等。当我从电子邮件屏幕单击下一步时,当我转到密码屏幕时,键盘仍然打开。导航到新屏幕时,如何检测键盘是否打开

一旦进入密码屏幕,键盘侦听器就会正常工作。这是我的密码。唯一的问题是,当屏幕加载时,我无法检测键盘状态

 constructor(props) {
        super(props);

        this.state = {
            email: {
                value: "",
                valid: false,
                touched: false,
                validationRules: {
                    isEmail: true
                }
            },
            headerStyles: {
                marginTop: 30,
                marginBottom: 70,
                marginLeft: 20
            },
            buttonTouched: false,
            emailAlreadyTaken: false
        }
    }

    // componentDidMount
    componentDidMount() {
        this.keyboardDidShowListener = Keyboard.addListener("keyboardDidShow", this._keyboardDidShow);
        this.keyboardDidHideListener = Keyboard.addListener("keyboardDidHide", this._keyboardDidHide);
    }

    // componentWillMount
    componentWillUnmount() {
        this.keyboardDidShowListener.remove();
        this.keyboardDidHideListener.remove(); 
    }

    // If the keyboard is visible
    _keyboardDidShow = () => {
        this.setState({
            headerStyles: {
                marginTop: 10,
                marginBottom: 30,
                marginLeft: 20
            } 
        });
    }

    // If the keyboard is not visible
    _keyboardDidHide = () => {
        this.setState({
            headerStyles: {
                marginTop: 30,
                marginBottom: 70,
                marginLeft: 20
            }
        });
    }

    // navigation options
    static navigationOptions = () => {
        return {
            headerTitle: null,
            headerStyle: {
                backgroundColor: "white"
            }
        };
    };
当我导航到新屏幕时,如何检测键盘状态

// If the keyboard is visible
_keyboardDidShow = () => {
    this.setState({
        keyBoardIsOn: true, // SET TO FALSE KEYBOARD SHOWN
        headerStyles: {
            marginTop: 10,
            marginBottom: 30,
            marginLeft: 20
        } 
    });
}

// If the keyboard is not visible
_keyboardDidHide = () => {
    this.setState({
        keyBoardIsOn: false, // SET TO FALSE KEYBOARD HIDDEN
        headerStyles: {
            marginTop: 30,
            marginBottom: 70,
            marginLeft: 20
        }
    });
}

_navigate = () = {
    if(this.state.keyBoardIsOn) {
        // Do Stuff
    }
}