Training Grounds
Frozen InputWhite Belt
+10 Ki
Description

A text input lets the user type a name and displays a greeting using that name below the field.

Anomaly

Clicking into the input and typing produces no visible change. The displayed name never updates.

Constraint
Do not remove the value prop
Hint

Look at what's on the input element - is everything React needs to manage it actually there?

Consult the SenseiOnly for those truly stuck · Flip to reveal

Look at what's on the input element - is everything React needs to manage it actually there?

Practice 23 related drills →
Loading editor…
Correct Solution
Loading...

Why this fixes it

A controlled input with a `value` prop but no `onChange` handler gives React nowhere to send the user's keystrokes, so React rejects every change and holds the field at whatever value state holds. Adding `onChange={(e) => setName(e.target.value)}` routes each keystroke into `setName`, updating state with the new value on every change event. React then re-renders the input with the fresh state value.

Expected OutputGoal State
Your OutputLive