vue-axios使用详解


Posted in Javascript onMay 10, 2017

vue-axios

GET请求

axios.get("/user?id=1")
  .then(function(response){
  })
  .catch(function(error){
  })

POST请求

axios.post('/user', {
  firstName: 'Fred',
  lastName: 'Flintstone'
 })
 .then(function (response) {
  console.log(response);
 })
 .catch(function (error) {
  console.log(error);
 });

合并请求

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
 }));

配置

import Qs from 'qs'
{
 //请求的接口,在请求的时候,如axios.get(url,config);这里的url会覆盖掉config中的url
 url: '/user',

 // 请求方法同上
 method: 'get', // default
 // 基础url前缀
 baseURL: 'https://some-domain.com/api/',




 transformRequest: [function (data) {
  // 这里可以在发送请求之前对请求数据做处理,比如form-data格式化等,这里可以使用开头引入的Qs(这个模块在安装axios的时候就已经安装了,不需要另外安装)

data = Qs.stringify({});
  return data;
 }],

 transformResponse: [function (data) {
  // 这里提前处理返回的数据

  return data;
 }],

 // 请求头信息
 headers: {'X-Requested-With': 'XMLHttpRequest'},

 //parameter参数
 params: {
  ID: 12345
 },

 //post参数,使用axios.post(url,{},config);如果没有额外的也必须要用一个空对象,否则会报错
 data: {
  firstName: 'Fred'
 },
 auth: {
  username: 'janedoe',
  password: 's00pers3cret'
 },
 //设置超时时间
 timeout: 1000,
 //返回数据类型
 responseType: 'json', // default

  .....等等
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
从零开始学习jQuery (六) jquery中的AJAX使用
Feb 23 Javascript
js中的前绑定和后绑定详解
Aug 01 Javascript
解决jquery版本冲突的有效方法
Sep 02 Javascript
jQuery.Highcharts.js绘制柱状图饼状图曲线图
Mar 14 Javascript
Javascript类型转换的规则实例解析
Feb 23 Javascript
JavaScript数组的栈方法与队列方法详解
May 26 Javascript
JS实现添加,替换,删除节点元素的方法
Jun 30 Javascript
AngularJS 模型详细介绍及实例代码
Jul 27 Javascript
老生常谈js中0到底是 true 还是 false
Mar 08 Javascript
详解vue-loader在项目中是如何配置的
Jun 04 Javascript
JS实现可用滑块滑动的缓动图代码
Sep 01 Javascript
mapboxgl实现带箭头轨迹线的代码
Jan 04 Javascript
详解axios在vue中的简单配置与使用
May 10 #Javascript
jQuery+PHP+Mysql实现抽奖程序
Apr 12 #jQuery
JavaScript实现form表单的多文件上传
Mar 27 #Javascript
Vue.js使用$.ajax和vue-resource实现OAuth的注册、登录、注销和API调用
May 10 #Javascript
利用PM2部署node.js项目的方法教程
May 10 #Javascript
全面解析vue中的数据双向绑定
May 10 #Javascript
利用forever和pm2部署node.js项目过程
May 10 #Javascript
You might like
PHP 开发工具
2006/12/06 PHP
Yii中srbac权限扩展模块工作原理与用法分析
2016/07/14 PHP
PHP折半(二分)查找算法实例分析
2018/05/12 PHP
php使用QueryList轻松采集js动态渲染页面方法
2018/09/11 PHP
Yii2框架配置文件(Application属性)与调试技巧实例分析
2019/05/27 PHP
PHP实现提高SESSION响应速度的几种方法详解
2019/08/09 PHP
PHP+fiddler抓包采集微信文章阅读数点赞数的思路详解
2019/12/20 PHP
CentOS7系统搭建LAMP及更新PHP版本操作详解
2020/03/26 PHP
js wmp操作代码小结(音乐连播功能)
2008/11/08 Javascript
js cookies实现简单统计访问次数
2009/11/24 Javascript
AngularJS 自定义过滤器详解及实例代码
2016/09/14 Javascript
关于webuploader插件使用过程遇到的小问题
2016/11/07 Javascript
jQuery插件echarts实现的多折线图效果示例【附demo源码下载】
2017/03/04 Javascript
详解vue 配合vue-resource调用接口获取数据
2017/06/22 Javascript
Angularjs上传文件组件flowjs功能
2017/08/07 Javascript
JavaScript生成指定范围的时间列表
2018/03/19 Javascript
vue和better-scroll实现列表左右联动效果详解
2019/04/29 Javascript
layui使用label标签的方法
2019/09/14 Javascript
jQuery操作元素追加内容示例
2020/01/10 jQuery
JS如何把字符串转换成json
2020/02/21 Javascript
[45:59]EG vs OG 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/18 DOTA
Python正则表达式匹配HTML页面编码
2015/04/08 Python
用Pygal绘制直方图代码示例
2017/12/07 Python
Python 读取图片文件为矩阵和保存矩阵为图片的方法
2018/04/27 Python
Python实现自定义读写分离代码实例
2019/11/16 Python
TensorFlow实现从txt文件读取数据
2020/02/05 Python
大女孩胸罩:Big Girls Bras
2016/12/15 全球购物
struct和class的区别
2015/11/20 面试题
师范生教师实习自我鉴定
2013/09/27 职场文书
教师档案管理制度
2014/01/23 职场文书
行政经理岗位职责
2015/04/15 职场文书
2016年会领导致辞稿
2015/07/29 职场文书
清明扫墓感想
2015/08/11 职场文书
中学政教处工作总结
2015/08/13 职场文书
2016年母亲节广告语
2016/01/28 职场文书
python编写五子棋游戏
2021/05/25 Python