Vue 3多语言错误码映射需按locale分层组织映射表，拦截器通过延迟获取当前语言调用i18n-aware解析函数查表，错误提示交由国际化通知组件展示，并注意拦截器初始化早于i18n挂载等陷阱。
Vue 3 中请求拦截器处理多语言环境下的错误码映射，核心在于把错误提示从硬编码字符串升级为可动态切换的本地化文案，同时确保拦截器能感知当前语言并正确查表。
错误码映射表需按语言分层组织
不能只维护一份中文 errorMap，而应按 locale 结构组织，例如：
src/utils/i18n/errorMap.ts
- 导出一个嵌套对象，顶层键为语言标识（如 'zh-CN'、'en-US'）
- 每种语言下是 { 状态码/业务码: 提示文案 } 的映射
- 支持 fallback：当某语言缺失某错误码时，自动降级到默认语言（如 zh-CN）
拦截器中动态获取当前语言并查表
响应拦截器内不直接引用静态文案，而是调用一个 i18n-aware 的错误解析函数：
vue-composition-api-best-practices
下载
Vue 3 组合式 API 与 最佳实践，涵盖代码组织、useXxx 模式、组合式函数设计、Store 集成、响应式优化及功能抽取。
立即学习“前端免费学习笔记（深入）”；
- 通过 i18n.global.locale.value（若使用 vue-i18n@v9）或 Pinia store 获取当前语言
- 传入错误码（如 res.code 或 error.response?.status）和当前 locale，返回对应文案
- 对 401、403、500 等 HTTP 错误和后端自定义业务错误码统一走同一查表逻辑
提示展示需适配多语言 UI 组件
错误文案拿到后，不能直接 alert 或 console.log，而应交由国际化友好的通知系统：
- 调用 ElMessage.error(t('error.network'))（Element Plus）或类似封装
- 确保 t() 函数已注入全局，并支持运行时 locale 切换
- 若需跳转登录页（如 401），路由路径也应通过 i18n 路由前缀生成，例如 router.push(`/${locale.value}/login`)
避免常见陷阱
实际开发中容易忽略的关键点：
- 拦截器初始化时机早于 i18n 实例挂载，因此不能在 interceptors.use 回调里直接访问 i18n.global —— 应改用延迟取值（如函数内调用）或依赖注入方式
- 错误码映射表本身需参与打包构建，不能放在 runtime 配置中导致热更新失效
- 服务端返回的 message 字段若已是多语言内容（如带占位符的模板），则应在查表后做插值（如 `t('user.not_found', { id })`）
