2 回答

TA貢獻1811條經驗 獲得超5個贊
return (
<form>
<input
type="text"
placeholder="Search..."
value={filterText}
onChange={(e) => handleFilterTextChange(e)}
/>
<p>
<input
type="checkbox"
checked={inStockOnly}
onChange={(e) => handleInStockChange(e)}
/>{" "}
Only show products in stock
</p>
</form>
);
無需使用 props 即可在組件內部自動訪問狀態。

TA貢獻1784條經驗 獲得超7個贊
我認為您使這件事變得比必要的復雜得多。
你在這里得到了道具的回調,對吧?
只需使用它們。根本不需要 useState() 。
function SearchBar(props){
const { onFilterTextChange, onInStockChange, filterText, inStockOnly } = props;
return (
<form>
<input
type="text"
placeholder="Search..."
value={filterText}
onChange={(e) => onFilterTextChange(e.target.value)}
/>
<p>
<input
type="checkbox"
checked={inStockOnly}
onChange={(e) => onInStockChange(e.target.checked)}
/>
{' '}
Only show products in stock
</p>
</form>
);
}
添加回答
舉報