axios

程昱
• 阅读 897

axios

axios 是一个基于Promise用于浏览器和node.js的HTTP客户端
它具有以下特性:

  • 支持浏览器和node.js
  • 支持 Promise API
  • 拦截请求和响应
  • 自动转换JSON数据
  • 客户端支持防御XSRF
  • 取消请求
  • 转换请求数据和响应数据

基本用法

axios.get('/abc')
  .then(res => {
    // res 是数据集合
    // data 属性名称是固定的,用于获取后台响应的数据
    console.log(res.data)
  })
  
axios.get('/cbd')
  .then(res => {
    console.log(res.data);
  })
  .catch(err => {
    console.log(err);
  });

axios常用API

API 说明
get 查询数据
post 提交数据
put 修改数据
delete 删除数据
GET传递参数
// 直接通过url拼接参数,进行传递参数
axios.get('/abc?id=123')
  .then(res => {
    console.log(res.data)
  })

axios拦截器

请求拦截器 在请求发出之前设置一些信息
// 添加一个请求拦截器
axios.interceptors.request.use(config => {
  // 在请求发出之前进行一些信息设置
  return config
}, err => {
  // 处理响应的错误信息
)
响应拦截器 在获取数据之前对数据做一些处理
// 添加一个响应拦截器
axios.interceptors.response.use(res => {
  // 在这里对返回的数据进行处理
  return res
}, err => {
  // 处理响应的错误信息
})
点赞
收藏
评论区
推荐文章
Stella981 Stella981
3年前
LinkWeChat 基于企业微信的SCRM私域流量开源系统
LinkWeChat(https://gitee.com/LinkWeChat/linkwechat"LinkWeChat")平台介绍LinkWeChat(https://gitee.com/Li
Wesley13 Wesley13
3年前
PHP安全性防范方式
<h2SQL注入</h2<pSQL注入是一种恶意攻击,用户利用在表单字段输入SQL语句的方式来影响正常的SQL执行。</p<h4防范方式</h4<ul<li使用mysql\_real\_escape\_string(),或者addslashes()过滤数据</li<li手动检查每一数据是否为正确的数据类型</li<li使用
Wesley13 Wesley13
3年前
Activiti 工作流入门指南
<divclass"htmledit\_views"id"content\_views"<h1<aname"t0"</a概览</h1<p如我们的介绍部分所述,Activiti目前分为两大类:</p<ul<li<p<ahref"https://activiti.gitbook.io/activiti7deve
Stella981 Stella981
3年前
ASMSupport教程4.8 生成逻辑运算操作
<p在java中有以下逻辑运算符:</p<ul<li&amp;&amp;:条件与</li<li||:条件或</li<li&amp;:布尔型的逻辑与</li<li|:布尔型的逻辑或</li<li^:布尔型的逻辑异或</li<li!:非操作</li</ul<p那么接下来我们将些段例子
Wesley13 Wesley13
3年前
mysql 5.7 windows zip安装
<ol<limysql官网下载windowszip安装包并解压(D:wampmysql56winx64)</li<li添加pathD:wampmysql5722winx64bin</li<li创建data目录D:\\wamp\\mysql56winx64\\data</li<li<p创建mysql配置文
Stella981 Stella981
3年前
ASMSupport教程4.11 生成数组操作
<p在任何语言里,数组都是基本的数据类型,我们这一节将讲述如何生成数组操作。</p<p数组操作包括以下几个:</p<ol<li创建数组</li<li获取数组长度</li<li获取数组每个元素的内容</li<li为数组元素赋值</li</ol<p我们接下来对每种操作进行详解。</p<h3<fonts
Stella981 Stella981
3年前
IdeaVim
<divid"cnblogs\_post\_body"class"blogpostbodycnblogsmarkdown"<h3id"ideavim简介"IdeaVim简介</h3<pIdeaVim是IntelliJIDEA的一款插件,他提高了我们写代码的速度,对代码的跳转,查找也很友好。</p<ul<li安装位置</
Stella981 Stella981
3年前
Array.prototype.slice.call()的理解
最近在看廖雪峰的JS课程,浏览器中的操作DOM的那一章,有这样一道题。JavaScriptSwiftHTMLANSICCSSDirectX<!HTML结构<ulid"testlist"<liJavaScript</li
Stella981 Stella981
3年前
ASMSupport教程4.12 生成方法调用操作
<p这一节我们讲如何用ASMSupport生成方法调用的操作,方法调用包括下面四种类型:</p<ol<li调用构造方法<li调用静态方法<li调用非静态方法<li调用当前类的方法<li调用父类方法</li</ol<p首先我们需要看我们想要生成的类:</p<p代码1:</p<h3<divid"scid:9D
Wesley13 Wesley13
3年前
HTML快捷写法大全
父子用\ \Ulli\3\<ul\    <li\</li\    <li\</li\    <li\</li\</ul\兄弟之间用,也可以省写\pspan\,\ul\<p\</p\<span
liam liam
2年前
使用 Axios 请求库:简单易学的基础指南
Axios是一个流行的基于Promise的HTTP请求库,用于在浏览器和Node.js中进行HTTP请求。它提供了简单易用的API,可以发送各种类型的请求(如GET、POST、PUT、DELETE等),并处理响应数据,Axios在前端工程化项目中有99%的
程昱
程昱
Lv1
少小离家老大回,乡音无改鬓毛衰。
文章
10
粉丝
0
获赞
0