'Form data is sent twice in react
I'm doing a form in react. I created a function using useState, to catch the data of my inputs, then another function for my form. But it turns out that when I click on my button on my form, the data is sent double, what can I do?
The function of my form is like this
const handleSubmit = (evt)=>{
evt.preventDefault();
let respond = FormValidation(inputValues);
if (respond.message) {
setError(respond)
}else{
auth.signUp(inputValues);
}
}
const signUp = (author) =>{
setLoading(true)
const {usuario, email, contraseña} = author
const obj_author = {
nombre : usuario,
email : email,
contrasenna : contraseña
}
console.log(obj_author); //Here the console shows me the data twice
axios.post(API_ROUTE, obj_author,{
method : 'POST',
headers : {
"Content-type":'application/json'
}
}).then((res)=>{
setLoading(false)
setAuth(obj_author)
setIsLogin(true)
console.log(res.data);
}).catch((err)=>{
setLoading(false)
setError(err)
})
}
The function of my inputs is this
const handleChange = (evt)=>{
evt.preventDefault();
const input = evt.target
const value = input.type === 'checkbox' ? input.checked : input.value
setInputValues({
...inputValues,
[input.name] : value
})
};
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
