Quiero enviar un formulario, así que creé una función para eso. Tengo un formulario de envío y el botón no debería habilitarse hasta que todos los campos del formulario estén completamente llenos.
Todas las validaciones funcionan, pero esto no es un problema, lo necesito para un evento onclick.
Mi código funciona, pero cuando hago clic en la casilla de verificación una vez para que sea verdadero y hago clic nuevamente para que sea falso, el botón debe estar deshabilitado , pero nuevamente estará habilitado. ...
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} />Para la casilla de verificación, debe cambiar de la propiedad de value a la propiedad checked y acceder a event.target.checked en su lugar, es decir
<input type="checkbox" checked={checkbox} onChange={(e) => setCheckbox(e.target.checked)} />Los documentos de reacción también tienen un ejemplo.
Las casillas de verificación son especiales y no tienen un .value , sino que desea buscar .checked en la función onChange de sus casillas de verificación.
Como esto...
onChange={(e) => setCheckbox(e.target.checked)}