Home > Mobile >  Error when using autofocus on an input element (Reactjs)
Error when using autofocus on an input element (Reactjs)

Time:10-06

I have the following element

<textarea className='title' autofocus="autoFocus" 
   onChange={(e)=>changeBill(e, 'title')} 
   value={bill?.title} 
   placeholder="Bill Title">
</textarea>

When I open the browser, it gives the following warning:

Warning: Invalid DOM property autofocus. Did you mean autoFocus?

It's still working, but the warning is pretty annoying. I tried "autofocus" and "autoFocus" neither prevents the warning.

CodePudding user response:

The warning is not about the value of the property, but the property name itself. It should be:

<textarea className='title' autoFocus={true} 
   onChange={(e)=>changeBill(e, 'title')} 
   value={bill?.title} 
   placeholder="Bill Title">
</textarea>

Also the property is accepting true or false. In your example the non empty string is interpreted as true.

  • Related