javascript / intermediate
Snippet
Error Propagation Control with onErrorCaptured
The onErrorCaptured hook allows a parent component to catch errors from its descendants. Returning 'false' is an intermediate technique to stop the error from reaching the global error handler, effectively creating an error boundary.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
import { onErrorCaptured, ref } from 'vue';const error = ref(null);onErrorCaptured((err, instance, info) => {error.value = `Error in ${info}: ${err.message}`;console.error('Captured:', err);return false; // Prevents the error from bubbling up further});
vue
Breakdown
1
onErrorCaptured((err, instance, info) => { ... })
Hooks into the error propagation chain of the component tree.
2
return false;
Stops the error from propagating to the global config.errorHandler.