使用 Axios 处理 AxiosError 的三种常见方法

在使用 Axios 时处理 AxiosError 有几种常见的方法:

1. 使用 try-catch 语句捕获异常:

try {  const response = await axios.get('/api/data');  // 处理响应数据} catch (error) {  if (error.response) {    // 请求成功但状态码不在 2xx 范围    console.log(error.response.data);    console.log(error.response.status);    console.log(error.response.headers);  } else if (error.request) {    // 请求发出但没有收到响应    console.log(error.request);  } else {    // 在设置请求时发生了错误    console.log('Error', error.message);  }}

1. 使用 Axios 实例的 interceptors 拦截器:

const instance = axios.create();instance.interceptors.response.use(  (response) => {    // 处理成功响应    return response;  },  (error) => {    // 处理错误响应    if (error.response) {      // 请求成功但状态码不在 2xx 范围      console.log(error.response.data);      console.log(error.response.status);      console.log(error.response.headers);    } else if (error.request) {      // 请求发出但没有收到响应      console.log(error.request);    } else {      // 在设置请求时发生了错误      console.log('Error', error.message);    }    return Promise.reject(error);  });

1. 使用 axios.isAxiosError() 判断错误是否来自 Axios:

axios.get('/api/data')  .then((response) => {    // 处理响应数据  })  .catch((error) => {    if (axios.isAxiosError(error)) {      // 处理 AxiosError      if (error.response) {        // 请求成功但状态码不在 2xx 范围        console.log(error.response.data);        console.log(error.response.status);        console.log(error.response.headers);      } else if (error.request) {        // 请求发出但没有收到响应        console.log(error.request);      } else {        // 在设置请求时发生了错误        console.log('Error', error.message);      }    } else {      // 处理其他类型的错误      console.log('Error', error);    }  });