Tengo problemas para que esto funcione como quiero. Básicamente, tengo un campo de entrada con un 0 prefijado. Necesito que devuelva 0 si no hay un 1 insertado (solo en ese caso debería devolver 1). Pero no puedo cambiar la entrada después de escribir un número y console.log no devuelve solo 0 o 1. Este es el código:
import { useState } from "react"; import "./App.css"; const App = () => { const [inputValue, setInputValue] = useState('0'); const changeInputValue = (event) => { let newInput = event.target.value === "1" ? 1 : 0; setInputValue(newInput); console.log(newInput); }; return ( <div className="App"> <div> <label for="input1">Enter 0 or 1:</label> <input type="number" id="input1" value={ inputValue } onChange={(e) => changeInputValue(e)} /> </div> </div> ); }; export default App;
Verifique que está usando '0' como valor predeterminado, no 0 y '0' es una cadena, use parseInt()
o elimine las comillas, también debe convertir el valor de la entrada en un número también. También recomiendo usar htmlFor en lugar de for en su etiqueta.
Solo cambia esto (inicializas una cadena)
const App = () => { const [inputValue, setInputValue] = useState('0');
Por esto
const App = () => { const [inputValue, setInputValue] = useState(0);