MemoryLeak MemoryLeak - 22 days ago 11
React JSX Question

Issue with data-reactid attribute in reactjs

I am not able to type anything into the below input text, which has been created using reactjs

<input type="text" id="txtName" className= "form-control" value=""/>


and the equivalent html code in browser is as below

<input id="txtName" class="form-control" value="" data-reactid=".0.0.0.1.0.1.0.1.1" type="text">


I am not able to fix this for some time, finally I changed the data-reactid attribute manually in the browser.

After I changed the value of data-reactid manually in the browser, I am able to type characters into the input field.

I have many other screens with text input field, which has no such issues.

how to fix this issue? why this issue occurs, I mean what's the issue with data-reactid attribute?

Aus Aus
Answer

When using "value" you're telling React this is a controlled component, that is, the input is set programatically.

Just remove the value field and you're good to go.

Reference

https://facebook.github.io/react/docs/forms.html