how react programmatically focus input

Question

I\'m trying to implement a very simple use case, a UI feature, where:

1. There is a label with some content in it
2. If clicked, a text input replaces it wi

Answer 1

In addition to the previous answers, I've added setTimeout to make it work

handleClick() {


    if (this.searchInput) {
        setTimeout(() => {

            this.searchInput.focus();

        }, 100);
    }
}

where searchInput is the jsx ref of the input

 { this.searchInput = input; }}
      placeholder="Search" />

and the handleClick() is an onClick handler to any element