Navigate to with state updated-CodePudding

I have a confirm button that implements a request and redirect to an other component. How can I wait data before navigating to the new component?


const {
    isLoading,
    error,
    request
} = useHttp();


const confirmHandler = () => {
      request({
        url: API_PATH.create_coupledCertificates,
        method: "POST",
        contentType: "application/json",
        body: body,
      });
    }
    navigate(component, {
      state: { isLoading, error },
    });
  };

The problem is that in this way the isLoading and error variables don't have the updated values.

CodePudding user response：

Use async/await syntaxis:

const confirmHandler = async () => {
    await request({
        url: API_PATH.create_coupledCertificates,
        method: "POST",
        contentType: "application/json",
        body: body,
    });
    navigate(component, {
      state: { isLoading, error },
    });
  };

or Promise

const confirmHandler = () => {
    return request({
        url: API_PATH.create_coupledCertificates,
        method: "POST",
        contentType: "application/json",
        body: body,
    })
    .then(() => {
      navigate(component, {
        state: { isLoading, error },
      });
    }
  };

CodePudding user response：

const confirmHandler = () => {
request({
 url: API_PATH.create_coupledCertificates,
 method: "POST",
 contentType: "application/json",
 body: body,
  }).then((response) => {
// do wharever you want here you can use response
navigate(component, {
  state: { isLoading, error },
});
}).catch((error)=> {
console.log(error)
})
}