什么是axios
原文: https://blog.csdn.net/qq_40837310/article/details/123028044
1.使用格式和jquery的ajax很相似,和最初的相比可以链式调用,1.5版本后的jquery也支持了链式调用,可以很好的处理连续回调的问题。
axios({
url: '/getUsers',
method: 'get',
responseType: 'json', // 默认的
data: {
//'a': 1,
//'b': 2,
}
}).then(function (response) {
console.log(response);
console.log(response.data);
}).catch(function (error) {
console.log(error);
})
2.axios的过滤器,axios.interceptors.request.use()和axios.interceptors.response.use()
3.promise和axios
3.1 new Promise()返回一个promise对象,该对象共有三种状态:进行中、已完成和失败,回调函数的调用是根据对象的状态来完成的;该对象的原型上拥有then和catch等方法。
3.2 Promise.resolve('foo');//等价于如下 new Promise((resolve)=>{ resolve('foo'); })
3.3 resolve方法的作用是把promise对象的状态从进行中变成已完成,同时可以向resolve方法传入参数,这个参数会在将来被promise对象的then方法获取,而reject方法也是同样的道理,只不过是把promise对象状态变成失败,同时传入的参数会被catch方法获取而已
3.4 esolve和reject方法的作用只不过是根据代码逻辑,把promise对象的状态置为已完成或失败,同时通知promise方法的then方法或catch方法:我们已经修改promise对象的状态,接下来需要你们(then和catch)根据对象的状态决定走哪条路。说白了,resolve、reject就是promise对象和then、catch之间的狗腿子。
3.5延伸至axios:因为axios是基于promise的,因此axios异步请求也返回一个promise对象,所以有axios().then()这样的写法,这说明axios本身已经对异步请求的过程做了封装,若请求成功则传递响应内容给then方法,否则传递给catch方法。
原文:https://blog.csdn.net/tdhszsh/article/details/123423670
4.baseURL、timeout全局配置
axios.defaults.baseURL="http://localhost:3000";也可以在请求过滤器中增加 config.timeout = 5000;
5.async和await
axios本身默认是异步请求,如果需要同步获取数据的话需要使用async和await关键字。
什么是axios的更多相关文章
- 为什么axios请求接口会发起两次请求
之前在使用axios发现每次调用接口都会有两个请求,第一个请求时option请求,而且看不到请求参数,当时也没注意,只当做是做了一次预请求,判断接口是否通畅,但是最近发现并不是那么回事. 首先我们知道 ...
- axios基本用法
vue更新到2.0之后,作者就宣告不再对vue-resource更新,而是推荐的axios,前一段时间用了一下,现在说一下它的基本用法. 首先就是引入axios,如果你使用es6,只需要安装axios ...
- Axios、Lodash、TweenJS
Axios是一个基于promise的HTTP库 http://chuansong.me/n/394228451820 Lodash是一个JavaScript的函数工具集 http://www.css8 ...
- axios全攻略
随着 vuejs 作者尤雨溪发布消息,不再继续维护vue-resource,并推荐大家使用 axios 开始,axios 被越来越多的人所了解.本来想在网上找找详细攻略,突然发现,axios 的官方文 ...
- 抛弃vue-resource拥抱axios
vue-resource用法 import Vue from 'vue' import VueResource from 'vue-resource' Vue.use(VueResource) 是不是 ...
- Vue+axios 实现http拦截及路由拦截
现如今,每个前端对于Vue都不会陌生,Vue框架是如今最流行的前端框架之一,其势头直追react.最近我用vue做了一个项目,下面便是我从中取得的一点收获. 基于现在用vue+webpack搭建项目的 ...
- vue使用Axios做ajax请求
vue2.0之后,就不再对vue-resource更新,而是推荐使用axios 1. 安装 axios $ npm install axios 或 $ bower install axios 2. 在 ...
- vue全家桶(Vue+Vue-router+Vuex+axios)(Vue+webpack项目实战系列之二)
Vue有多优秀搭配全家桶做项目有多好之类的咱就不谈了,直奔主题. 一.Vue 系列一已经用vue-cli搭建了Vue项目,此处就不赘述了. 二.Vue-router Vue的路由,先献上文档(http ...
- 9.如何解决出现AXIOS的Request header field Content-Type is not allowed by Access-Control-Allow-Headers in preflight response.
问题描述: 由于restful接口需要在头部header传递两个字段: Content-Type: application/jsonAccess-Token: 84c6635800b14e0eba4f ...
- vue2.0设置proxyTable使用axios进行跨域请求
这里请求的是知乎日报的api,由@izzyleung这位大神提供的,这是github地址. 在vue-cli构建的项目中先安装axios npm install axios -S 这里暂不考虑用vue ...
随机推荐
- 使用vue 搭建猫眼后台演员列表
首先创建一个DirectorList.vue js部分
- zookeeper要点总结
简述:zookeeper分布式协调服务,节点数据存储在内存,高吞吐,低延时,zkserver cluster组建zookeeper service保证自身高可用 zookeeper数据模型为类文件目录 ...
- Vue ref属性
ref属性 1.被用来给元素或子组件注册引用信息(id的替代者) 2.应用在html标签上获取的是真实DOM元素: 应用在组件标签上是组件实例对象 vc 3.使用方法: (1)打标识:<h1 r ...
- SAP MD04屏幕显示增强
需求 在看物料MRP结果的时候,业务人员想要看到工单批次,工单批次是我们这边工单下达后传输到其他系统,然后由其他系统回传回来的. 开发步骤 主要使用二代增强出口:M61X0002 创建增强项目 事务码 ...
- DotNetCore2.1镜像上传DockerHub在Docker运行
操作步骤: 1.本地安装Docker(此处省略安装过程) 2.登录Docker 3.浏览器打开官方DockerHub地址注册用户(注意:注册操作需要FQ才能成功,后期登录和其他操作使用国内网络都可以) ...
- 用例需注意的点-UI自动化
记几条--用例注意事项:用例从功能里面转化而来,并且不能脱离业务(针对某一个页面功能\某一个流程业务,写一条用例:即将界面操作间接转化为代码去操作!)1用例要尽量独立,相互不影响!(单独一条都可运行) ...
- 单元测试成神之路——Golang篇
这位大佬写的太好了 https://zhangyuyu.github.io/golang-unit-test/
- Win10安装离线.NET3.5流程
二.安装步骤 1.将下载的安装包放到c盘windows目录下(根据需要放置) 2.用命令行安装 以管理员身份打开cmd,输入以下命令(c:\windows即文件放置目录,即上一步放置目录) dism. ...
- Python中Websocket的实现及基本原理
一.什么是 WebSocket ? WebSocket 是一种标准协议,用于在客户端和服务端之间进行双向数据传输.但它跟 HTTP 没什么关系,它是基于 TCP 的一种独立实现. 以前客户端想知道服务 ...
- 《CSOL大灾变》Mobile移植记录——购买区域
在CSOL大灾变模式中,购买武器只能出现在特定区域,如下: 这里可以通过添加一些不渲染的BOX(如图中的蓝色BOX)作为触发器,然后检测玩家与之触发后才能弹出购买菜单. 在JmonkeyEngi ...