axios封装/基础配置

步骤:装包 -> 封装axios实例 ->调用实例发送请求

1. 装包

npm install axios

2. 封装 axios基础配置

javascript 复制代码
// axios实例封装
import axios from 'axios'

// 创建axios实例
const axiosInstance = axios.create({
    baseURL:'http://xxx.net',   //基地址
    timeout:5000  //超时时间
})

// 拦截器(看文档,无需记)

// axios请求拦截器
axiosInstance .interceptors.request.use(config => {
    return config
},e => Promise.reject(e))

// axios响应拦截器
axiosInstance .interceptors.response.use(res => res.data, e => {
    return Promise.reject(e)
})

export default httpInstance

3. 调用实例 发送请求

javascript 复制代码
// 组件中
import request from '@/utils/http

export const getAPI = () => {
    return request({
        url:'接口',
        method:'请求类型'
    })
}

参考:

起步 | Axios 中文文档 | Axios 中文网 (axios-http.cn)

相关推荐
无聊的老谢1 小时前
Vue 3 + TypeScript 构建大型电信运维平台的前端架构设计
前端·vue.js·typescript
薛先生_0994 小时前
vue-路由重定向
前端·javascript·vue.js
吠品5 小时前
PyTorch 踩坑:libtorch_cpu.so 找不到 iJIT_NotifyEvent 符号
前端·vue.js·elementui
xiaofeichaichai5 小时前
Vue 响应式原理
前端·javascript·vue.js
丑八怪大丑5 小时前
前端工程化
vue.js
前端 贾公子6 小时前
uni-app工程化实战:基于vue-i18n和i18n-ally的国际化方案 (上)
前端·javascript·vue.js
无聊的老谢8 小时前
Web GIS 最佳实践:Vue 集成 Leaflet/OpenLayers 实现基站海量点位渲染
前端·javascript·vue.js
老毛肚11 小时前
jeecgboot TS + Vue 模板化 03
前端·javascript·vue.js
FlyWIHTSKY11 小时前
React 19 + Next.js 16(App Router)项目中集成 MSW
开发语言·javascript·vue.js
2401_8685347813 小时前
常见的 vue面试题目
前端·javascript·vue.js