Web / ReactJS Interview questions
What are React controlled components and uncontrolled components?
A Controlled Component takes its current value through props and notifies changes through callbacks like onChange. A parent component "controls" it by handling the callback and managing its own state and passing the new values as props to the controlled component. This is also called "dumb component".
A Uncontrolled Component stores its own state internally, and you query the DOM using a ref to find its current value when you need it. This is a bit more like traditional HTML.
// Controlled: <input type="text" value={value} onChange={handleChange} /> // Uncontrolled: <input type="text" defaultValue="foo" ref={inputRef} /> // Use `inputRef.current.value` to read the current value of <input>
More Related questions...