Keyboard isn't shown upon TextInput autoFocus [react native]

Question

I have this reply button in my app where when a user press it, it will change the TextInput autoFocus to true. I set the autoFocus value to false as default value and keep it in a state. I see the state will change to true but it doesn't open the keyboard.

This is my TextInput :

<TextInput
    autoFocus={this.state.textInputFocus}
    selectTextOnFocus={true}
    ref={ref => this.textInputRef = ref}
    multiline = {true}
    placeholder="Write a comment ..."
    onChangeText={(postComment) => this.setState({postComment})}
    value={this.state.postComment} />

Here is the function to change the state when reply button is pressed :

_openReplyBox(comment_id, commenter){
    this.setState({ postComment: commenter, textInputFocus: true })
}

Please refer to this link https://stackoverflow.com/questions/42371023/how-to-autofocus-next-textinput-on-react-native — Shubham, Apr 26 '19 at 10:12

score 1 · Accepted Answer · answered Apr 26 '19 at 10:17

Accordinig to docs:

autoFocus: If true, focuses the input on componentDidMount. The default value is false

You can use refs to achieve the same functionality.

 <TextInput
        ref={"textRef"}
        ...
      />

In openReplyBox:

_openReplyBox(comment_id, commenter){
    this.refs.textRef.focus();
    this.setState({ postComment: commenter})
}

Keyboard isn't shown upon TextInput autoFocus [react native]

1 Answers1