Estoy haciendo un formulario de registro y login con react, y resulta que a la hora de llenar el form y enviar los datos, el servidor me responde con que falta llenar los campos. Yo puse en el servidor de express que en caso de que se envíen campos vacíos se responda así, pero lleno los campos en el formulario y de igual manera me envía este error.
import { useNavigate } from 'react-router-dom'
import { useState } from 'react'
import axios from 'axios';
export default function Register(){
const [datos, setDatos] = useState({
nombre: '',
contraseña: ''
});
const [mensaje, setMensaje] = useState();
const [loading, setLoading] = useState(false);
const { nombre, contraseña } = datos;
const HandleChange = (e) => {
setDatos({ ...datos, [e.target.name]: e.target.value })
}
const onSubmit = async (e) => {
e.preventDefault()
if(nombre !== '' && contraseña !== '') {
const Usuario = {
nombre,
contraseña
};
//setLoading(true)
await axios
.post('http://localhost:4000/register', Usuario)
.then(({data}) => console.log(data))
}
}
const navigate = useNavigate();
return(
<div >
<h2>Bienvenido a Multiventas</h2>
<h3>Registrese para continuar</h3>
<form onSubmit={(e) => onSubmit(e)}>
<div>
<label htmlFor="nombre">Nombre</label>
<input
onChange={(e) => HandleChange(e)}
type="text"
id='nombre'
name='nombre'
placeholder='Ejm: Juan'
autoComplete="off"
/>
</div>
<div>
<label htmlFor="contraseña">Contraseña</label>
<input
onChange={(e) => HandleChange(e)}
type="password"
id='contraseña'
name='contraseña'
autoComplete="off"
/>
</div>
<button type="submit"> Registrarme </button>
<p>
¿Ya tienes cuenta?
<b onClick={() => navigate('/login')} style={{cursor: 'pointer'}} >Iniciar Sesion</b>
</p>
</form>
</div>
)
};