axios封装/基础配置

news2024/9/27 15:22:50

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

1. 装包

npm install axios

2. 封装 axios基础配置

// 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. 调用实例 发送请求

// 组件中
import request from '@/utils/http

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

参考:

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

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/985129.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

el-table 实现表、表格行、表格列合并

最近写vue开发项目的时候,很多地方用到了Element组件中的Table 表格。经过一周的边学边做,我总结了以下三种有关表格的合并方法。 一、合并表头 话不多说,先看效果图 代码如下: 表格结构如上,其中:header-cell-style对…

Java进行多线程编程?(lambda表达式~)

本文标题:Java进行多线程编程?那么,Java为啥不学学如何进程多进程编程呢??原因在于:Java圈子中不提倡多进程编程~~ 接下来,我们来写一个最为基础/入门的HelloWord程序来感受如何进行多线程~~ J…

数据资产管理:数据目录怎么搞?

经过了站在业务视角的自上而下的数据梳理,以及站在IT视角的自下而上的数据盘点,一套“热腾腾”的数据资产清单终于新鲜出炉了。 通过数据资产盘点,企业终于知道他们拥有哪些数据、如何使用数据、是否安全以及数据在哪里。 然而,据…

数据库误修改后的数据恢复

一不小心将数据库数据修改了,而且回滚无效,于是去尝试各种方法恢复数据 查询到修改时间点之前的数据 恢复数据 恢复数据库被修改数据的流程及代码,这里被修改的表是AUTH_USER,实际应用填写对应表名。 -- 通过时间恢复删除且已提交的数据-- 1…

Jenkins安装配置及插件安装使用

个人理解持续集成:为解决程序代码提交质量低,提交内容导致原有系统的BUG,按时或按需自动编译版本,进行自动化测试。 百度对持续集成的定义:持续集成是一种软件开发实践,即团队开发成员经常集成他们的工作,…

配额 安排

一 常用Tcode 基于Tcode的顺序排列 供应商主数据物料主数据货源清单配额安排采购信息记录采购订单框架协议采购询价/报价采购申请订单收货发票校验物料需求计划BP-供应商主数据MM01 - 物料主数据新增ME01 - 维护MEQ1 - 维护ME11 - 创建ME21N - 创建框架协议-合同&#xff1a…

Qt6_贪吃蛇Greedy Snake

贪吃蛇Greedy Snake 1分析 首先这是一个贪吃蛇界面,由一个长方形边框和一只贪吃蛇组成 默认开局时,贪吃蛇身体只有3个小方块,使用画笔画出 1.1如何移动 对于蛇的移动,有2种方法 在一定时间范围内(定时器),未对游戏…

谷歌 reCAPTCHA 人机验证

一、问题 smogon 论坛注册不成功。输入账号、密码、邮箱后显示 You did not complete the CAPTCHA verification properly. Please try again. 即未通过 CAPTCHA 验证。 二、原因 使用的 CAPTCHA 验证是谷歌的 reCAPTCHA 人机验证,国内无法访问谷歌服务。 三、解决…

分页查询实现

目录 1.实体类 2.Mapper层 2.1.xxxMapper接口 2.2.xxxMapper.xml文件 3.Service层 3.1.xxxService接口 3.2.xxxServiceImpl层 4.xxxController层 5.调用接口 6.总结 1.实体类 与数据库交互和与前端交互的实体类 这个Model是与数据库交互的实体类,其中的…

python调用GPT实现:智能用例生成工具

工具作用: 根据输入的功能点,生成通用测试点 实现步骤 工具实现主要分2个步骤: 1.https请求调用Gpt,将返回响应结果保存为.md文件 2.用python实现 将 .md文件转换成.xmind文件 3.写个简单的前端页面,调用上述步骤接口 详细代…

7个数据科学Python库将为您节省大量时间

7个数据科学Python库将为您节省大量时间 在进行数据科学时,您可能会花费大量时间编写代码并等待计算机运行某些操作。我挑选了一些可以在这两种情况下节省您时间的Python库。即使您只将其中一个库纳入您的工具库,您仍然可以在下次项目工作时节省宝贵的时…

揭示OLED透明屏数据:探索未来显示技术的潜力

OLED透明屏作为一项颇具吸引力的显示技术,以其独特的特点和卓越的画质在市场上引起了广泛关注。 在这篇文章中,尼伽将和大家一起深入探索OLED透明屏的数据,通过具体的市场趋势分析、技术指标解析、应用领域探讨和未来前景展望,为…

【C++基础】实现日期类

​👻内容专栏: C/C编程 🐨本文概括: C实现日期类。 🐼本文作者: 阿四啊 🐸发布时间:2023.9.7 对于类的成员函数的声明和定义,我们在类和对象上讲到过,需要进行…

mac 查看端口占用

sudo lsof -i tcp:port # 示例 sudo lsof -i tcp:8080 杀死进程 sudo kill -9 PID # 示例 sudo kill -9 8080

“搞事情”?OpenAl将于11月召开其首届开发者大会

摘要:OpenAI也要召开它的第一届开发者大会了。这次活动,或许标志着OpenAI向其下一阶段的商业开发迈出了关键一步。 昨天,OpenAI宣布将于11月6日举办其首次开发者大会。在这场名为“OpenAI DevDay”的活动中,OpenAI的技术人员将进行…

欧科云链与HashKey Exchange达成合作,助力香港虚拟资产合规化

继8月10日 欧科云链 与 华为云 达成合作之后, 今天,欧科云链 又与 Hashkey Exchange 共同宣布正式达成合作! 这次与Hashkey达成合作,双方又将在Web3行业中谱写怎样的故事? 9月6日,欧科云链控股有限公司&…

2023 年高教社杯全国大学生数学建模竞赛题目 C 题 蔬菜类商品的自动定价与补货决策

C 题 蔬菜类商品的自动定价与补货决策 在生鲜商超中,一般蔬菜类商品的保鲜期都比较短,且品相随销售时间的增加而变差, 大部分品种如当日未售出,隔日就无法再售。因此,商超通常会根据各商品的历史销售和需求情况每天进…

生物通路数据库收录1600+整合的经典通路

生物通路数据库为科学家提供了关于生物通路的大量信息和资源,特别是在数据整合、信息检索、数据可视化分析、数据交互、生物学研究等方面,积极推动了生物学研究和科学的发展。 世界各地正在创建各种类型的通路数据库,每个数据库都反映了其创…

快递批量查询高手必备的实用工具

在网购日益普及的今天,我们经常需要查询快递的物流信息。但是,传统的查询方式一个一个地输入快递单号,不仅费时费力,还容易出错。有没有一种方法可以批量查询多个快递单号呢?答案是肯定的,今天我们就来介绍…