我想發送一個表格,所以我為此創建了一個函式。我有一個提交表單,在表單的所有欄位都填滿之前,該按鈕不應啟用。
所有驗證都在作業,但這不是問題,我需要它來處理 onclick 事件。
我的代碼有效,但是當我單擊復選框一次使其為真并再次單擊使其為假時,該按鈕應該被禁用,但它會再次被啟用。...
const [name, setName] = useState("");
const [surname, setSurname] = useState("");
const [email, setEmail] = useState("");
const [checkbox, setCheckbox] = useState(false);
let handleSubmit = async (e) => {
e.preventDefault();
try {
...
}
};
return(
<Input
required
type="text"
value={name}
placeholder="?sim"
onChange={(e) => setName(e.target.value)}
/>
<Input
required
type="text"
value={surname}
placeholder="Soyisim"
onChange={(e) => setSurname(e.target.value)}
/>
<Input
required
type="email"
placeholder="E-mail"
onChange={(e) => setEmail(e.target.value)}
/>
<Input
type="checkbox"
required
value={checkbox}
onChange={(e) => setCheckbox(e.target.value)}
/>
<input
type="submit"
name="Onayl?yorum"
disabled={!name || !surname || !email || !checkbox}
/>
uj5u.com熱心網友回復:
對于復選框,您必須從value道具更改為checked道具并訪問,event.target.checked即
<input type="checkbox" checked={checkbox} onChange={(e) => setCheckbox(e.target.checked)} />
該反應檔案有一個例子太
uj5u.com熱心網友回復:
復選框是特殊的,沒有.value, 相反,您希望.checked在復選框onChange功能中查找。
像這樣...
onChange={(e) => setCheckbox(e.target.checked)}
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/403752.html
標籤:
