标准答案
- Vue 3 可以通过 app.config.errorHandler 捕获组件渲染、事件处理和生命周期中的未处理错误。
- 组件内部可以用 onErrorCaptured 捕获子组件错误，适合局部降级、错误边界和阻止错误继续冒泡。
- 请求错误不应该只依赖全局 errorHandler，通常要在请求封装层统一处理状态码、业务码、重试、登录失效和提示策略。
- 浏览器层面的 window.onerror、unhandledrejection、资源加载错误可以作为兜底上报入口。
- 错误上报要带上路由、用户标识、版本号、环境、组件信息、接口信息和 source map 映射，才能用于定位问题。
题目解析
这道题不能只答一个 app.config.errorHandler。真实项目里错误来源不同，捕获层也不同。
组件错误捕获适合做局部降级，但不要把所有错误吞掉。吞掉错误会让监控看不到真实失败，也会让页面进入不可解释状态。
上报系统要配合发布版本和 source map，否则线上堆栈很难还原到源码。用户隐私字段也要在上报前脱敏。
代码示例
下面展示了应用级 errorHandler 和组件级 onErrorCaptured 的常见位置。
TypeScript
const app = createApp(App)
app.config.errorHandler = (error, instance, info) => {
reportError({
error,
component: instance?.type?.name,
info,
route: router.currentRoute.value.fullPath
})
}TypeScript
onErrorCaptured((error, instance, info) => {
localError.value = error
reportError({ error, component: instance?.type?.name, info })
return false
})常见误区
- 只配置 Vue errorHandler，却没有处理接口错误、Promise 未捕获错误和资源加载失败。
- 组件捕获错误后直接 return false，但没有任何降级 UI 或上报。
- 错误上报缺少版本、路由、用户上下文和 source map，线上只能看到压缩后的堆栈。