Estoy tratando de hacer cálculos simples con un nuevo valor en un estado actualizado. Simplemente estoy tratando de dividir la entrada de un usuario, con otro número. Soy un principiante total, ¡así que perdóname por la pregunta novata! Aquí está mi código que no funciona para mí. No hay errores, simplemente no muestra la cifra resultante del cálculo:
import { useState } from "react"; const Counter = () => { const [area, setArea] = useState(""); const newArea = () => { setArea(area.target.value); }; const deckBoards = (newArea) => { (newArea / 0.145).toFixed(2); }; return ( <div label="Deck"> <h2>Total area of deck</h2> Area <input placeholder="Enter area here" type="text" onChange={newArea} type="number" /> <br /> <h2>Deck boards</h2>Deck boards at 140mm wide : {deckBoards} lineal metres </div>Falta un event en la función newArea y DeckBoards debe ser un area en JSx
Prueba esto
import { useState } from "react"; const Counter = () => { const [area, setArea] = useState(""); const deckBoards = (newArea) => { // it was missing return statement return (newArea / 0.145).toFixed(2); }; const newArea = (e) => { const value = e.target.value; // Calculate here const calculated = deckBoards(value); // Update value setArea(calculated); }; return ( <div label="Deck"> <h2>Total area of deck</h2> Area <input placeholder="Enter area here" type="text" onChange={newArea} type="number" /> <br /> <h2>Deck boards</h2>Deck boards at 140mm wide : {area} lineal metres </div> ); }