this is my code everything is ok but if statement doesn't work if i erase the if part of code the request works just fine but when it's inside of if it does't work my errors object is empty
const handleSubmit=(e)=> {
e.preventDefault();
setErrors(validate(values))
if (!errors) {
console.log(errors);
baseUrl.get("/sanctum/csrf-cookie").then((response) => {
baseUrl
.post("/api/v1/admin-login", values)
.then((response) => {
console.log(response);
})
.catch((err) => {});
});
}
and the errors state
const [errors, setErrors] = useState({});
that's because the value of error is not changed yet.
you can fix it in this way
const [errors, setErrors] = useState({})
const handleSubmit=(e)=> {
e.preventDefault();
const errors = validate(values)
setErrors(errors)
if (!errors) {
console.log(errors);
baseUrl.get("/sanctum/csrf-cookie").then((response) => {
baseUrl
.post("/api/v1/admin-login", values)
.then((response) => {
console.log(response);
})
.catch((err) => {});
});
}
The value has not changed yet because you set errors for the update state in the current function and the next line you want to use. You can use the local variable in the function to check errors.
setState() does not always immediately update the component. It may batch or defer the update until later. This makes reading this. state right after calling setState() a potential pitfall. https://reactjs.org/docs/react-component.html#setstate
const handleSubmit=(e)=> {
e.preventDefault();
const errors = validate(values)
setErrors(errors)
if (!errors) {
console.log(errors);
baseUrl.get("/sanctum/csrf-cookie").then((response) => {
baseUrl
.post("/api/v1/admin-login", values)
.then((response) => {
console.log(response);
})
.catch((err) => {});
});
}