reactjsautofocusrefs

autofocus in react based on condition if else

How to autofocus for input name based on whether this.props.email exists or not?

if(this.props.email){
    // would like to set autofocus for  <input value={email} name="userName">    
}else{
   // would like to set autofocus for  <input name="password" />
}

 <input value={email} name="userName">             
 <input name="password" />

I was thinking of using refs but is wondering if there is better way to access the name of the input

Solution

  • you may want to try this

    <input value={email} autoFocus={this.props.email} name="userName">