我想把 Axios 二次封装 用的TS泛型的,但是 Axios 不支持扩展自定义配置 我应该怎么做
【摘要】 如果 Axios 不支持扩展自定义配置,你可以考虑使用 Axios 的拦截器来对请求和响应进行处理,从而实现二次封装和自定义配置的目的。具体步骤如下:创建一个 Axios 实例,这样你可以设置默认的配置,例如默认的请求头、超时时间等。例如:import axios from 'axios'const instance = axios.create({ baseURL: 'http://ap...
如果 Axios 不支持扩展自定义配置,你可以考虑使用 Axios 的拦截器来对请求和响应进行处理,从而实现二次封装和自定义配置的目的。具体步骤如下:
- 创建一个 Axios 实例,这样你可以设置默认的配置,例如默认的请求头、超时时间等。例如:
import axios from 'axios' const instance = axios.create({ baseURL: 'http://api.example.com', timeout: 5000, headers: { 'Content-Type': 'application/json' } })
- 使用 Axios 的拦截器,在请求或响应被 then 或 catch 处理前,对它们进行预处理或者加工处理。例如:
// 请求拦截器 instance.interceptors.request.use( config => { // 处理请求前的配置 return config }, error => { // 处理请求错误 return Promise.reject(error) } ) // 响应拦截器 instance.interceptors.response.use( response => { // 处理响应数据 return response }, error => { // 处理响应错误 return Promise.reject(error) } )
在拦截器中,你可以根据自己的需求对请求和响应进行预处理或者加工处理,例如在请求中添加公共的请求头、在响应中对数据进行格式化等。
- 对外提供一个函数,这个函数可以接收自定义的配置参数,例如:
function request<T = any>(config: AxiosRequestConfig): Promise<T> { return instance.request<T>(config) }
在这个函数中,你可以将自定义的配置参数和默认配置合并,并调用 Axios 实例的 request 方法来发起请求。
最后,你可以根据自己的需求对这个函数进行进一步的封装和扩展,例如添加错误处理逻辑、统一的错误提示等。
综上所述,使用 Axios 的拦截器是一种常见的二次封装和自定义配置的方式,可以满足大部分场景的需求。
【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息, 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱:
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
评论(0)