Hice dos componentes, uno es el componente de inicio de sesión y el otro es la entrada de formulario.

Paso accesorios para formar entrada para representar algún formulario de entrada.

Y también tenía un estado para guardar el valor de estas entradas (enlace bidireccional).

La representación está bien hasta ahora.

El problema cuando envío el formulario y configuro el estado como inicial, vi el cambio de estado en el registro de la consola, pero mis entradas no mostraban eso, todavía mostraban los últimos valores que envié.

Gracias por tu ayuda

Este es mi componente de inicio de sesión:

 const SignIn: React.FC = () => { const [info, setInfo] = useState({ email: "", password: "", }) const handleSubmit = (event: React.FormEvent<HTMLFormElement>) => { event.preventDefault() setInfo({ email: "", password: "", }) } const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => { const { value, name } = event.target setInfo({ ...info, [name]: value }) } return ( <div className="sign-in"> <h2>I already have an account</h2> <span>Sign in with your email and password</span> <form onSubmit={handleSubmit}> <FormInput label="Email" name="email" type="email" value={info.email} handleChange={handleChange} required /> <FormInput label="Password" name="password" type="password" value={info.password} handleChange={handleChange} required /> </form> </div> ) }

Y este es mi componente FormInput:

 const FormInput: React.FC<Props> = ({ handleChange, label, value, ...otherProps }) => { return ( <div className="group"> <input className="form-input" onChange={handleChange} {...otherProps} /> {label ? ( <label className={`${value.length ? "shrink" : ""} form-input-label`}> {label} </label> ) : null} </div> ) }