fix(curriculum): update Step 12 instructions in the superhero application form workshop (#60803)

Co-authored-by: Huyen Nguyen <25715018+huyenltnguyen@users.noreply.github.com>
This commit is contained in:
Vishnu D 2025-06-12 14:39:15 +05:30 committed by GitHub
parent 49fbe88369
commit 4342119e21
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 5 additions and 5 deletions

View File

@ -7,9 +7,9 @@ dashedName: step-6
# --description--
You may notice you can't type in the `input`. If you open up the console you will see a warning.
You may notice you can't type in the `input`. If you open up the console you will see a warning.
To remove the warning, use the `onChange` event to update `heroName`. The value for the `onChange` event should be an arrow function with `e` for the parameter. The arrow function should implicitly return `setHeroName(e.target.value)`.
To remove the warning and fix the input typing issue, use the `onChange` event to update `heroName`. The value for the `onChange` event should be an arrow function with `e` for the parameter. The arrow function should implicitly return `setHeroName(e.target.value)`.
# --hints--
@ -19,7 +19,7 @@ Your `input` element should have an `onChange` attribute.
assert.match(code, /onChange\s*=\s*\{/)
```
You should use the `onChange` to set the value of the `heroName` state variable so you can type in the input field.
You should use `onChange` with an arrow function that implicitly returns to set the value of the `heroName` state variable.
```js
assert.match(code, /onChange\s*=\s*\{\s*(e|\(\s*e\s*\))\s*=>\s*setHeroName\s*\(\s*e\s*\.\s*target\s*\.\s*value\s*\)\s*\}/)

View File

@ -9,7 +9,7 @@ dashedName: step-12
The values of the `powerSourceOptions` now show up as the options for the `select` element.
Now, use `powerSource` as the value of the `select`. Then, add an `onChange` to set that value using the `setPowerSource` setter function and `e.target.value` like you did with the other form elements.
Now, use `powerSource` as the value of the `select` element. Then, set up an `onChange` handler using an arrow function that takes `e` as the parameter and implicitly returns `setPowerSource(e.target.value)`.
# --hints--
@ -19,7 +19,7 @@ You should use `{powerSource}` as the value of the `select` element.
assert.match(code, /<\s*select\s+[\s\S]*value\s*=\s*\{\s*powerSource\s*\}/)
```
You should set the value of the `select` element with `onChange` and `setPowerSource`.
You should set the value of the `select` element using `onChange` with an arrow function that implicitly returns to update the `powerSource` state with `setPowerSource`.
```js
assert.match(code, /<\s*select\s+[\s\S]*onChange\s*=\s*\{\s*(e|\(\s*e\s*\))\s*=>\s*setPowerSource\s*\(\s*e\s*\.\s*target\s*\.\s*value\s*\)/)