Error when using autofocus on an input element (Reactjs)

Question

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.

Shtobar · Accepted Answer · 2021-10-05 22:02:36Z

3

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.

answered Oct 5, 2021 at 22:02

Shtobar

1864 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Error when using autofocus on an input element (Reactjs)

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related