Question

0

61

Views

the handleSubmit function doesn't work in if sttaement

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({});

7 months ago · Juan Pablo Isaza

2 answers

Answer question

0

Answer question

Find remote jobs

Answer 1 · 2022-07-04T15:27:37.579Z

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) => {});
          });
     }

Answer 2 · 2022-07-04T15:27:37.589Z

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) => {});
      });
 }