How can we catch error from an async await function from where it's called?
For example, I have a React component which calls a async-await function imported from another module. When I use Promise.reject("An unknown has occurred");
in that function, so in my React component why can't I get the error in asyncAwaitFunction.catch((e)=>console.log(e))
?
I even tried throw "An unknown occured"
, but it doesn't seem to work.
react component
const handleSubmit = async (e) => {
e.preventDefault();
add(formData, code)
.then(() => router.push("/dashboard/manage"))
.catch((e) => setError(e)); //I want error to be catched here
};
functions.js
export const addUser = async (details, code) => {
const isExist = await isUser(code);
if (!isExist) {
const add = db.batch(); //firebase batch write
add.set(userID(code), details); //Add details to databse
add.commit()
.catch((e)=> {
console.log(e); // error occurs confirmed
Promise.reject("Unknown error occurred"); //this does't get catched in component.
});
} else {
Promise.reject("Already Exists!");
}
};
A rejected Promise (either from a Promise that you constructed that rejected, or from a Promise.reject
) will only be caught if:
.catch
is added onto the end of that Promise expression, or .then
, and the caller of the async function or after the .then
callback, there's a .catch
So, you should change to something like:
export const addUser = async (details, code) => {
const isExist = await isUser(code);
if (isExist) {
return Promise.reject('Already Exists!');
}
const add = db.batch(); //firebase batch write
add.set(userID(code), details); //Add details to databse
return add.commit().catch((e) => {
console.log(e); // error occurs confirmed
return Promise.reject("Unknown error occurred");
});
};
But do you really need to log in the .commit().catch
? If not, it'd be cleaner to just return the commit
Promise and catch in the caller:
export const addUser = async (details, code) => {
const isExist = await isUser(code);
if (isExist) {
return Promise.reject('Already Exists!');
}
const add = db.batch(); //firebase batch write
add.set(userID(code), details); //Add details to databse
return add.commit();
};
A Promise that is await
ed or returned from an async function will have its errors (or its resolve value) percolate up to the caller of the async function.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.