Tengo un campo de entrada al que quiero agregar validaciones. Las condiciones deben ser que la cantidad no puede ser 0 y no debe ingresar ningún carácter.
Mi código de reacción:
import React from 'react' import { useState } from 'react'; function LoanInput() { const [loanAmount, setLoanAmount] = useState(0); const handleValidation = (e) => { const formattedValue = (Number(e.target.value.replace(/\D/g, '')) || 0).toLocaleString(); setLoanAmount(formattedValue); } return ( <div className="LoanAmountInput"> <div className="LoanAmount"> <label>Loan Amount</label> <input type="text" value={loanAmount} onChange={handleValidation} /> <span style={{ color: "red" }}></span> </div> </div> ); } export default LoanInputEn realidad, puede usar la validación predeterminada proporcionada por el navegador usando el tipo de entrada. En tu caso, tu código sería el siguiente:
<input type="number" min="1" value={loanAmount} />¿Por qué este enfoque?