[FIXED] What is uncontrolled input field in a React app

Issue

What does it mean when React says input field is an uncontrolled field`? How it will affect the web page with a form of uncontrolled input fields. I can see a warning message in the console while changing values of the field, other than that what are other issues going to be there on the application?

Solution

An uncontrolled input is simply one where you're not using React to control the input's value (e.g, you don't use value={this.state.value} or similar); instead, you use a ref and get the value from the DOM directly. This means the DOM contains the "source of truth" for that piece of state, rather than your React model containing the source of truth for it.

React documentation links:

• Uncontrolled components
• Forms (including controlled components)

Answered By - T.J. Crowder

Answer Checked By - Katrina (PHPFixing Volunteer)