The keyboard does not pop up when the Android Textinput autoFocus is true

Environment

Platforms

only happen android

Versions

• Android:
• iOS:
• react-native-modal:11.5.3
• react-native:0.63.3
• react:

Description

Reproducible Demo

Here is our modal code <Modal isVisible={edit} style={styles.modalStyle} backdropTransitionOutTiming={0} onBackdropPress={() => this.resetState()} animationIn=“fadeInUp” animationOut=“fadeOutDown” avoidKeyboard={true} > <View style={{ backgroundColor: ‘white’, width: deviceWidth, paddingVertical: 10, borderTopLeftRadius: 10, borderTopRightRadius: 10, }} > <TextInput value={content} multiline={true} autoFocus={true} placeholder={‘回复本帖：’} maxLength={140} ref={(ref) => (this.contentInput = ref)} onBlur={this.contentInputBlur} onFocus={this.contentInputFocus} underlineColorAndroid=“transparent” onChangeText={(v) => this.setState({ content: v })} style={{ height: 100, width: deviceWidth - 30, backgroundColor: ‘#F7F7FB’, textAlignVertical: ‘top’, borderRadius: 8, alignSelf: ‘center’, padding: 15, }} /> </View> </Modal>

[David-Nguyen17]

It’s a solution <Modal isVisible={true} onModalShow={() => { this.inputRef.blur(); this.inputRef.focus(); } > <TextInput ref={ref => inputRef = ref} /> </Modal>

[bekazandukeli]

It will work:

export default function YourComponent() {
  const inputRef = React.useRef(null);
  return (
    <Modal isVisible={true} onModalShow={() => input.current.focus()} >
      <TextInput ref={inputRef} />
    </Modal>
}