Vue3使用TypeScript封装Axios

记录下

axios.ts文件

//引入嘛
import axios, { AxiosInstance, AxiosRequestConfig, AxiosResponse, AxiosError, InternalAxiosRequestConfig } from "axios"


//请求拦截器

axios.interceptors.request.use((config: InternalAxiosRequestConfig): InternalAxiosRequestConfig => {
  return config;
}, (err: AxiosError): Promise<Error> => {
  return Promise.reject(err);
});


//响应拦截器


axios.interceptors.response.use((res: AxiosResponse): AxiosResponse => {
  return res.data
}, (err: AxiosError): Promise<Error> => {
  return Promise.reject(err)
})

api.ts文件

//发请求的文件

import axios from "axios"

import type { AxiosResponse } from "axios"
interface IApi {
  JSON: string;
  APICode: number;
}

export const api = (data: IApi): Promise<AxiosResponse> => {
  return axios({
    url: "",
    method: "POST",
    data,
    headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
  })
}