ts对axios进行二次封装

在TypeScript中对axios进行二次封装可以增加额外的功能，比如错误处理、取消请求、自动转换数据等。以下是一个简单的例子：

首先，安装axios库（如果尚未安装）：

npm install axios

然后，创建一个封装axios的文件，比如http.ts：

import axios, { AxiosRequestConfig, AxiosResponse, AxiosError } from 'axios';
 
class HttpClient {
  constructor(private baseURL: string) {}
 
  request<T>(config: AxiosRequestConfig): Promise<AxiosResponse<T>> {
    return axios.request<T>({ ...config, baseURL: this.baseURL });
  }
 
  get<T>(url: string, config?: AxiosRequestConfig): Promise<AxiosResponse<T>> {
    return this.request<T>({ ...config, method: 'GET', url });
  }
 
  post<T>(url: string, data?: any, config?: AxiosRequestConfig): Promise<AxiosResponse<T>> {
    return this.request<T>({ ...config, method: 'POST', url, data });
  }
 
  // 可以添加其他HTTP方法，如PUT, DELETE等
 
  // 错误处理
  handleError(error: AxiosError) {
    // 这里可以根据错误类型和状态码进行处理
    console.error('An error occurred:', error);
    // 可以抛出自定义错误或进行重试等策略
  }
}
 
export default HttpClient;

使用封装后的HttpClient：

import HttpClient from './http';
 
const httpClient = new HttpClient('https://api.example.com');
 
httpClient.get('/data')
  .then(response => console.log(response.data))
  .catch(error => httpClient.handleError(error));

这个例子中，HttpClient类封装了基本的HTTP请求方法，并提供了一个错误处理方法。在实例化时传入基础URL，之后可以使用这个实例发送请求，所有请求都会经过这个实例的请求方法，可以在这里添加全局配置或拦截器。