Axios all in one

https://github.com/axios/axios#example

GET

const axios = require('axios');

// Make a request for a user with a given ID
axios.get('/user?ID=12345')
.then(function (response) {
// handle success
console.log(response);
})
.catch(function (error) {
// handle error
console.log(error);
})
.then(function () {
// always executed
}); // Optionally the request above could also be done as
axios.get('/user', {
params: {
ID: 12345
}
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
})
.then(function () {
// always executed
}); // Want to use async/await? Add the `async` keyword to your outer function/method.
async function getUser() {
try {
const response = await axios.get('/user?ID=12345');
console.log(response);
} catch (error) {
console.error(error);
}
} // NOTE: async/await is part of ECMAScript 2017 and is not supported in Internet Explorer and older browsers, so use with caution.

POST


// Performing a POST request axios.post('/user', {
firstName: 'Fred',
lastName: 'Flintstone'
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
}); // Performing multiple concurrent requests function getUserAccount() {
return axios.get('/user/12345');
} function getUserPermissions() {
return axios.get('/user/12345/permissions');
} axios.all([getUserAccount(), getUserPermissions()])
.then(axios.spread(function (acct, perms) {
// Both requests are now complete
}));


demo

    fetchTableData(options = {}){
const {
current: pageIndex,
size: pageSize,
// uid,
activityIdOrName,
venueName,
seatMap,
} = options;
this.loading = true;
this.tableData = [];
// const url = `/opapi/opapi/v2/seatMap/activities?pageSize=${size}&pageIndex=${current}`;
const url = `/opapi/opapi/v2/seatMap/activities`;
axios
.get(url, {
params: {
activityIdOrName,
venueName,
seatMap,
pageIndex,
pageSize,
},
})
.then(res => res.data)
.then(json => {
const {
state,
success,
page: {
total,
current,
// size,
},
data,
} = json;
if (state === 200) {
// this.tableData = this.dataShaper(data) || [];
this.pagination.total = total;
this.pagination.current = current;
} else{
this.tableData = [];
}
this.loading = false;
})
.catch(err => {
this.tableData = tableData;
this.loading = false;
console.error(err);
});
},

refs



xgqfrms 2012-2020

www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!


Axios all in one的更多相关文章

  1. 为什么axios请求接口会发起两次请求

    之前在使用axios发现每次调用接口都会有两个请求,第一个请求时option请求,而且看不到请求参数,当时也没注意,只当做是做了一次预请求,判断接口是否通畅,但是最近发现并不是那么回事. 首先我们知道 ...

  2. axios基本用法

    vue更新到2.0之后,作者就宣告不再对vue-resource更新,而是推荐的axios,前一段时间用了一下,现在说一下它的基本用法. 首先就是引入axios,如果你使用es6,只需要安装axios ...

  3. Axios、Lodash、TweenJS

    Axios是一个基于promise的HTTP库 http://chuansong.me/n/394228451820 Lodash是一个JavaScript的函数工具集 http://www.css8 ...

  4. axios全攻略

    随着 vuejs 作者尤雨溪发布消息,不再继续维护vue-resource,并推荐大家使用 axios 开始,axios 被越来越多的人所了解.本来想在网上找找详细攻略,突然发现,axios 的官方文 ...

  5. 抛弃vue-resource拥抱axios

    vue-resource用法 import Vue from 'vue' import VueResource from 'vue-resource' Vue.use(VueResource) 是不是 ...

  6. Vue+axios 实现http拦截及路由拦截

    现如今,每个前端对于Vue都不会陌生,Vue框架是如今最流行的前端框架之一,其势头直追react.最近我用vue做了一个项目,下面便是我从中取得的一点收获. 基于现在用vue+webpack搭建项目的 ...

  7. vue使用Axios做ajax请求

    vue2.0之后,就不再对vue-resource更新,而是推荐使用axios 1. 安装 axios $ npm install axios 或 $ bower install axios 2. 在 ...

  8. vue全家桶(Vue+Vue-router+Vuex+axios)(Vue+webpack项目实战系列之二)

    Vue有多优秀搭配全家桶做项目有多好之类的咱就不谈了,直奔主题. 一.Vue 系列一已经用vue-cli搭建了Vue项目,此处就不赘述了. 二.Vue-router Vue的路由,先献上文档(http ...

  9. 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 ...

  10. vue2.0设置proxyTable使用axios进行跨域请求

    这里请求的是知乎日报的api,由@izzyleung这位大神提供的,这是github地址. 在vue-cli构建的项目中先安装axios npm install axios -S 这里暂不考虑用vue ...

随机推荐

  1. 关于MongoDB的简单理解(二)--Java篇

    一.声明 本文依赖于 MongoDB JVM DRIVERS 4.1 版本编写. 本文案例依赖于 Maven 项目管理工具. 二.本文主要讲解哪些内容? 如何连接到MongoDB 通过TLS/SSL连 ...

  2. LOJ10098

    USACO 2006 Jan. Gold 为了从F个草场中的一个走到另一个,贝茜和她的同伴们不得不路过一些她们讨厌的可怕的树.奶牛们已经厌倦了被迫走某一条路,所以她们想建一些新路,使每一对草场之间都会 ...

  3. (五)整合 Swagger2 ,构建接口管理界面

    整合 Swagger2 ,构建接口管理界面 1.Swagger2简介 1.1 Swagger2优点 1.2 Swagger2常用注解 2.SpringBoot整合Swagger2 2.1 Swagee ...

  4. SonarQube+jenkins-自动化持续代码扫描

    SonarQube+jenkins-自动化持续代码扫描 1.SonarQube 1.1 SonarQube介绍 1.1.1 SonarQube 工作流程 1. 2 Docker方式安装SonarQub ...

  5. Phoenix简介概述,Phoenix的Java API 相关操作优秀案例

    Phoenix简介概述,Phoenix的Java API 相关操作优秀案例 一.Phoenix概述简介 二.Phoenix实例一:Java API操作 2.1 phoenix.properties 2 ...

  6. 网络编程(socket简介)

    socket简介 Python 提供了两个基本的 socket 模块. 第一个是 Socket,它提供了标准的 BSD Sockets API. 第二个是 SocketServer, 它提供了服务器中 ...

  7. Hive 使用总结

    1 带分区列的表更改列类型 常见的一个场景是Hive里面一个带分区的表,原来是int类型的字段,后来发现数据超过了int的最大值,要改成bigint.或者是bigint要改string或decimal ...

  8. 操作系统中的描述符和GDT

    在操作系统中,全局描述符是什么?GDT又是什么?在进入保护模式之前,准备好GDT和GDT中的描述符是必须的吗?用汇编代码怎么创建描述符?本文解答上面几个问题. 在实模式下,CPU是16位的,意思是,寄 ...

  9. Pycharm怎么安装?

    摘要:工欲善其事必先利其器,每个人都有自己心中理想的集成开发环境,这里我们不做讨论,今天只介绍Pycharm怎么安装. 首先打开官网:https://www.jetbrains.com/pycharm ...

  10. Educational Codeforces Round 89 (Rated for Div. 2) A Shovels and Swords B、Shuffle

    题目链接:A.Shovels and Swords 题意: 你需要一个木棍和两个钻石可以造出来一把剑 你需要两个木棍和一个钻石可以造出来一把铁锹 你现在有a个木棍,b个钻石,问你最多可以造出来几件东西 ...