mirror of
https://github.com/reactjs/react.dev.git
synced 2026-02-27 03:08:06 +00:00
Add guiding note (#6501)
* Add guiding note * Update sandbox to include event handlers
This commit is contained in:
committed by
GitHub
parent
5964bfa502
commit
1ab7108159
@@ -484,12 +484,26 @@ function FilterableProductTable({ products }) {
|
||||
|
||||
Inside the `SearchBar`, you will add the `onChange` event handlers and set the parent state from them:
|
||||
|
||||
```js {5}
|
||||
<input
|
||||
type="text"
|
||||
value={filterText}
|
||||
placeholder="Search..."
|
||||
onChange={(e) => onFilterTextChange(e.target.value)} />
|
||||
```js {4,5,13,19}
|
||||
function SearchBar({
|
||||
filterText,
|
||||
inStockOnly,
|
||||
onFilterTextChange,
|
||||
onInStockOnlyChange
|
||||
}) {
|
||||
return (
|
||||
<form>
|
||||
<input
|
||||
type="text"
|
||||
value={filterText}
|
||||
placeholder="Search..."
|
||||
onChange={(e) => onFilterTextChange(e.target.value)}
|
||||
/>
|
||||
<label>
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={inStockOnly}
|
||||
onChange={(e) => onInStockOnlyChange(e.target.checked)}
|
||||
```
|
||||
|
||||
Now the application fully works!
|
||||
|
||||
Reference in New Issue
Block a user