const [letters, setLetters] = useState({ A: false, B: false, C: false }) function handleClick(input){ setLetters((prevLetters) => ({ ...prevLetters, [input]: true })) } handleClick("A")¿Cómo gestiono que, según la entrada, la letra correcta se establezca en verdadero? Entonces, si la entrada es A, debe establecerse en verdadero en el objeto de letras.
Creo que un mapa sería una buena opción aquí.
const [letters, setLetters] = useState(new Map()); function handleClick (input) { setLetters(letters.set(input, true)); } handleClick("A"); Si desea que la input DEBE ser A, B o C, entonces puede usar una declaración if:
const [letters, setLetters] = useState(new Map([ ["A", false], // default values for map ["B", false], ["C", false], ])); function handleClick (input) { if (!letters.has(input)) return; // if map doesnt have it, stop setLetters(letters.set(input, true)); // can also use letters.set(input, false) to "turn it off" } handleClick("A");Si desea anular las propiedades existentes en el objeto de letters , puede hacer algo como esto
const lettersObject = { A: false, B: false, C: false, }; const [letters, setLetters] = useState(lettersObject); function handleClick(input) { setLetters({ ...lettersObject, [input]: true, }); }¿Es esto lo que estás buscando?
function handleClick(input) { setLetters((prevLetters) => ({ letters: { ...prevLetters, input: true } })); }