Vue全局异常捕获errorHandler
需求: 把vue项目的所有接口请求异常/代码异常捕获并落日志。技术点: vue全局应用配置errorHandler方法(参考vue官方文档)errorHandler可以捕获的异常类型1.代码里的异常错误的js语法使用(errorHandler自动捕获)2.接口请求异常接口请求报错404,500等(需手动提交完成捕获)errorHandler在项目中的具体应用1.main.js文件全局注册error
·
需求: 把vue项目的所有接口请求异常/代码异常捕获并落日志。
技术点: vue全局应用配置errorHandler方法
(参考vue官方文档)
errorHandler可以捕获的异常类型
1.代码里的异常
错误的js语法使用(errorHandler自动捕获)
2.接口请求异常
接口请求报错404,500等(需手动提交完成捕获)
errorHandler在项目中的具体应用
1.main.js文件
全局注册errorHandler方法
//Vue全局异常捕获,落日志
const errorHandler = (err, vm, info)=>{
console.warn('Vue全局异常捕获开始===========')
console.log(`Error: ${err.toString()}\nInfo: ${info}`)
if (err.isAxiosError) {
console.log('axios请求错误!!')
}
console.warn('Vue全局异常捕获结束===========')
}
Vue.config.errorHandler = errorHandler;
Vue.prototype.$throw = (error)=> errorHandler(error,this);
2.响应拦截
在公共方法axios请求的响应拦截错误回调函数里,使用 Vue.$throw(err)
将错误信息提交给errorHandler函数去捕获处理
console.warn(`响应拦截异常!!!\n错误信息:${err.toString()}\n接口名称:${err.config.url}`)
Vue.$throw(err)
3.落日志(略)
更多推荐
已为社区贡献1条内容
所有评论(0)