Question

此模态中有一个Modal和一个TextInput，我希望打开键盘，出现模态时，键盘只出现在IOS中。

TextInput具有焦点，但是，只有在用户点击TextInput时，键盘才会出现。

这是我的代码：

export default class MyModal extends React.Component { 

    componentDidMount() {
        this.ref.focus();
    }

    render() {
        return  (
            <View style={styles.container}>
                <Modal
                    animationType="slide"
                    transparent
                    visible={true}
                    onRequestClose={() => {}}>
                    <View style={styles.modalViewStyle}>
                        <View style={styles.modalContainer}> 
                         <TextInput
                            ref={ref => this.ref = ref}
                            autoFocus={true}
                            value={this.props.reflection}
                            onChange={ e => this.props.onChange('reflection', e) }
                        />  
                        </View>
                        </View>    
                    </View>
                </Modal>
            </View>)
    }
}

Answer 1

您的Modal是否从屏幕底部出现？如果是这样，则有可能键盘确实出现了，但是它被隐藏在Modal后面。如果是这种情况，则基于键盘的事件功能keyboardDidShow, keyboardDidHide（https://facebook.github.io/react-native/docs/keyboard#docsNav）将您的模式向上推（marginBottom：键盘高度）。希望这可以帮助。

出现模态模式时，无法在Android上打开键盘

1 个答案: