ts axios请求封装

对于 TypeScript 中的 Axios 请求封装，你可以创建一个单独的文件或者模块来处理这个逻辑。以下是一个简单的示例：

import axios, { AxiosRequestConfig, AxiosResponse } from 'axios';

// 创建一个自定义的请求实例
const instance = axios.create({
  baseURL: 'https://api.example.com',
  timeout: 5000, // 请求超时时间
});

// 定义请求拦截器
instance.interceptors.request.use(
  (config: AxiosRequestConfig) => {
    // 可以在这里做一些请求前的处理，比如添加请求头等
    return config;
  },
  (error: any) => {
    // 错误处理
    return Promise.reject(error);
  }
);

// 定义响应拦截器
instance.interceptors.response.use(
  (response: AxiosResponse) => {
    // 可以在这里对响应数据做一些处理，比如统一处理错误码等
    return response;
  },
  (error: any) => {
    // 错误处理
    return Promise.reject(error);
  }
);

// 封装 GET 请求
export const get = <T>(url: string, params?: any): Promise<T> => {
  return instance.get<T>(url, { params });
};

// 封装 POST 请求
export const post = <T>(url: string, data?: any): Promise<T> => {
  return instance.post<T>(url, data);
};

// 封装其他请求方式，比如 PUT、DELETE 等

使用时，可以在其他文件中导入封装好的请求方法，并发起请求，例如：

import { get, post } from './api';

// 发起 GET 请求
get<User[]>('/users')
  .then(response => {
    const users = response.data;
    // 处理响应数据
  })
  .catch(error => {
    // 处理错误
  });

// 发起 POST 请求
const data = { username: 'example', password: 'password' };
post('/login', data)
  .then(response => {
    // 处理响应数据
  })
  .catch(error => {
    // 处理错误
  });

这只是一个简单的示例，你可以根据自己的项目需求进行更加复杂的封装，比如添加请求取消、错误提示等功能。希望对你有所帮助！如有其他问题，请随时提问。