The React docs state:
In a controlled component, form data is handled by a React component. The alternative is uncontrolled components, where form data is handled by the DOM itself.
Form elements, includes input, select, text area. They all keep a internal state and updates every time the user provides input.
Controlled component(recommended way):
React is the one who controlled these form elements. More specifically, react is in charge of controlling when and how to render it based on the internal logic of setState method.
The developer gets access to the HTML element in question by using React.createRef() methods, which allows the developer to integrate React with other JS-based libraries.
React: Controlled VS Uncontrolled Components
Understanding the difference between controlled and uncontrolled React components.