Trade-offs; Ref Patterns; Default Values
Compare controlled vs uncontrolled inputs, use refs for reads, and provide sensible defaults.
Controlled vs uncontrolled
Goal: Pick the right input style.
- Controlled: value in state; re-render on change
- Uncontrolled: DOM keeps value; read via ref on demand
- Defaults: defaultValue, defaultChecked
Trade-offs at a glance
- Controlled: great for live validation, masks, syncing other fields
- Uncontrolled: fewer renders; simple submit-only forms
- Mix: controlled for key fields, uncontrolled for optional ones
All lessons in this course
- Trade-offs; Ref Patterns; Default Values
- Prop Getters & State Reducer (Light)