vue 3 统一错误处理需建立可识别、可扩展的语义化错误分类体系，通过继承 error 的 businesserror 类携带 code 和 data，在 errorhandler 及全局异常捕获中按 code 分流提示，并解耦提示逻辑至独立函数与配置表。
Vue 3 中统一错误处理要实现“不同错误类型对应不同提示”，关键不是写一堆 if-else 判断 message 字符串，而是建立可识别、可扩展的错误分类体系，并在 errorHandler 中按类型分支响应。
定义语义化业务错误类
原生 Error 对象只有 message 和 stack，无法区分“登录过期”和“网络超时”。需主动构造带 code 的错误：
- 新建 src/utils/BusinessError.ts，继承 Error 并添加 code 和可选 data
- 所有业务逻辑中抛错统一用它： throw new BusinessError('请求失败', 'NETWORK_TIMEOUT', { retry: true })
- API 请求层（如 Axios 响应拦截器）也应将 HTTP 状态码映射为标准 code，例如 401 → 'AUTH_EXPIRED'，403 → 'NO_PERMISSION'
在 errorHandler 中按 code 分流提示
main.ts 中配置 app.config.errorHandler 时，不再只做 console.error，而是根据 err.code 决定行为：
vue-composition-api-best-practices
Vue 3 组合式 API 与
热门下载
相关下载
精品课程
相关推荐
/
热门推荐
/
最新课程
最新文章