Octagram Labs
JavaScriptData StructuresReact
Sign in
← Back to problems

Controlled Field Change

Events & Formseasy

Course · Section 9: Data Structures, Modern Operators and Strings · Lecture 111: The Spread Operator (...)

Implement `handleChange(state, field, value)` returning new form state with `field` set to `value`.

Sample tests

Input: handleChange({"name":"a"}, "name", "ab")
Output: {"name":"ab"}
Input: handleChange({"name":"","email":"x"}, "email", "y")
Output: {"name":"","email":"y"}

+ 1 hidden test run on Submit.

Hints

Common pitfalls
  • Mutating the form state object.
  • Replacing the whole form instead of one field.

Learning resources

  • React: Reacting to Input with State
Approach & explanation (try first)

Returning { ...state, [field]: value } updates one controlled field while preserving the others, the canonical onChange handler.

Loading...
⌘/Ctrl + Enter

Run your code to see results.