- 首先创建axios的实例:
import axios , { AxiosRequestConfig, AxiosResponse } from 'axios'
const axiosInstance = axios.create()
- 然后就是核心方法了:
function Request<T = unknown>(
configParam: AxiosRequestConfig
) {
return axiosInstance.request<T, AxiosResponse<T>>(configParam)
}
export { Request }
- 你还可以在Request的基础上,根据请求类型再封一层,比如Get:
function Get<T>(url: string , params = {}) {
return Request<T>({ url, params, method: 'get' })
}
- 使用例子:
import { Request } from '@/utils/axios'
export const LoginPost = (loginForm: {
username: string
password: string
}) => {
return Request<BaseResponse>({
url: '/v1/login',
method: 'POST',
params: loginForm
})
}
但我们有时可能需要再封一层promise,那么可以这样写:
function Request<T = unknown>(configParam: AxiosRequestConfig): Promise<AxiosResponse<T>> {
return new Promise((resolve) => {
axiosInstance.request<T, AxiosResponse<T>>(configParam).then((res) => {
resolve(res)
})
})
}
如果想去掉axios的那层data,那么可以这么写:
function Request<T = unknown>(configParam: AxiosRequestConfig): Promise<T> {
return new Promise((resolve) => {
axiosInstance.request<T, AxiosResponse<T>>(configParam).then((res) => {
resolve(res.data)
})
})
}