What are React controlled components and uncontrolled components?

Question

What are controlled components and uncontrolled components in ReactJS? How do they differ from each other?

Answer 1

Controlled component is component that get the changed value from the callback function and uncontrolled component is component that have the one from the DOM. For example, When input value is changed,we can use onChange function in Controlled Component and also we can get the value using DOM like ref.