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)

相关推荐
李剑一32 分钟前
我用Trae生成了一个Echarts 3D柱状图的Demo
前端·vue.js·trae
一 乐44 分钟前
宠物猫店管理|宠物店管理|基于Java+vue的宠物猫店管理管理系统(源码+数据库+文档)
java·前端·数据库·vue.js·后端·宠物管理
熊猫比分管理员1 小时前
【全栈源码解决方案】Vue+Java四端齐全,一周交付可运行项目!
java·前端·vue.js
o***74171 小时前
【Nginx 】Nginx 部署前端 vue 项目
前端·vue.js·nginx
一 乐1 小时前
考公|考务考试|基于SprinBoot+vue的考公在线考试系统(源码+数据库+文档)
前端·javascript·数据库·vue.js·spring boot·课程设计
特级业务专家1 小时前
把 16MB 中文字体压到 400KB:我写了一个 Vite 字体子集插件
javascript·vue.js·vite
humor2 小时前
Quill 2.x 从 0 到 1 实战 - 为 AI+Quill 深度结合铺路
前端·vue.js
驯狼小羊羔4 小时前
学习随笔-hooks和mixins
前端·javascript·vue.js·学习·hooks·mixins
麦麦大数据5 小时前
F048 体育新闻推荐系统vue+flask
前端·vue.js·flask·推荐算法·体育·体育新闻
小肚肚肚肚肚哦5 小时前
🎮 从 NES 到现代 Web —— 像素风组件库 Pixel UI React 版本,欢迎大家一起参与这个项目
前端·vue.js·react.js