Tengo una función de cálculo, cada vez que pongo los números en el campo de entrada, quiero que calcule el resultado cuando se hace clic en el botón Enviar y también quiero que muestre el resultado en un div. ahora, cada vez que presiono el botón, muestra el resultado correcto en la consola, pero quiero saber cómo puedo mostrar el resultado final en un div dentro de un formulario con ganchos.
el botón :
const handleSubmit = (e) => { e.preventDefault(); console.log(solution) }la forma :
<div onChange={(e) => setResult(solution)}> result : {setResult} </div>Supongo que ha especificado su estado de esta manera:
const [result, setResult] = useState();En este caso, debe cambiar su controlador para actualizar el estado cada vez que obtenga un resultado:
const handleSubmit = (e) => { e.preventDefault(); //... setResult(solution) }y renderizarlo en el div:
<div> result: {result} </div>NOTA: el elemento div no tiene evento onChange
<div> no tiene onChange . Creo que lo que estás tratando de hacer es escuchar los cambios en la solución. La mejor manera de hacerlo es con useState . Si mantiene su solución en estado con algo como const [result, setResult] = useState() , el div se parecerá más a:
<div> result : {result} </div>Solo necesita asegurarse de que está actualizando el estado correctamente cuando se presiona el botón. Tal vez como:
const handleSubmit = (e) => { e.preventDefault(); //... do calculation and assign it to solution variable setResult(solution) }