How to focus an input element on page load?

You can do it by creating ref for input element and using it in componentDidMount():

class App extends React.Component {
componentDidMount() {
this.nameInput.focus();
}
render() {
return (
<div>
<input defaultValue={"Won't focus"} />
<input ref={(input) => (this.nameInput = input)} defaultValue={'Will focus'} />
</div>
);
}
}
ReactDOM.render(<App />, document.getElementById('app'));

Made in India with ❤️ by Rajesh Kumar Yadav

Twitter