This content originally appeared on remy sharp's b:log and was authored by remy sharp's b:log
I don't particularly use this pattern, but I ran across it recently and it took me a while to work out what was happening (it does make sense if you think about it, but running through code it's not easy to spot).
In the following example you won't see any errors nor any logging.
useEffect(() => {
const test = async = () => {
someFunctionThatThrows();
console.log("sid");
};
try {
test();
} catch (e) {
console.log("sam");
}
}, []);
It needs to either change to to explicitly catches (which I tend to prefer because it feels explicit) or a try catch inside the async:
useEffect(() => {
const test = async = () => {
try {
someFunctionThatThrows();
} catch (e) {
console.error(e);
}
console.log("test has finished");
};
test();
}, []);
Or, which covers more cases:
useEffect(() => {
const test = async = () => {
someFunctionThatThrows();
console.log("test has finished");
};
test().catch(e => console.error(e));
}, []);
Originally published on Remy Sharp's b:log
This content originally appeared on remy sharp's b:log and was authored by remy sharp's b:log
remy sharp's b:log | Sciencx (2023-02-16T17:00:25+00:00) React’s useEffect swallows async errors [til/javascript]. Retrieved from https://www.scien.cx/2023/02/16/reacts-useeffect-swallows-async-errors-til-javascript/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.