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 相关文章推荐
JavaScript 继承详解(二)
Jul 13 Javascript
jQuery控制图片的hover效果(smartRollover.js)
Mar 18 Javascript
ECMAScript 创建自己的js类库
Nov 22 Javascript
转义字符(\)对JavaScript中JSON.parse的影响概述
Jul 17 Javascript
js中的hasOwnProperty和isPrototypeOf方法使用实例
Jun 06 Javascript
javascript解三阶幻方(九宫格)
Apr 22 Javascript
使用angularjs创建简单表格
Jan 21 Javascript
js仿百度切换皮肤功能(html+css)
Jul 10 Javascript
axios 处理 302 状态码的解决方法
Apr 10 Javascript
详解使用 Node.js 开发简单的脚手架工具
Jun 08 Javascript
JS代码触发事件代码实例
Jan 02 Javascript
Vue 同步异步存值取值实现案例
Aug 05 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实现小写金额转换大写金额的代码(精确到分)
2012/01/10 PHP
PHP中数组合并的两种方法及区别介绍
2012/09/14 PHP
php自动给文章加关键词链接的函数代码
2012/11/29 PHP
PHP快速按行读取CSV大文件的封装类分享(也适用于其它超大文本文件)
2014/04/10 PHP
php实现向javascript传递数组的方法
2015/07/27 PHP
Jquery 学习笔记(一)
2009/10/13 Javascript
Javascript 闭包引起的IE内存泄露分析
2012/05/23 Javascript
JavaScript中的noscript元素属性位置及作用介绍
2013/04/11 Javascript
JS子父窗口互相操作取值赋值的方法介绍
2013/05/11 Javascript
jquery的选择器的使用技巧之如何选择input框
2013/09/22 Javascript
不提示直接关闭网页窗口的JS示例代码
2013/12/17 Javascript
关于JavaScript命名空间的一些心得
2014/06/07 Javascript
js查找节点的方法小结
2015/01/13 Javascript
浅谈利用JavaScript进行的DDoS攻击原理与防御
2015/06/04 Javascript
JavaScript中的数据类型转换方法小结
2015/10/26 Javascript
AngularJS基础 ng-focus 指令简单示例
2016/08/01 Javascript
axios简单实现小程序延时loading指示
2018/07/30 Javascript
深入解析Python编程中JSON模块的使用
2015/10/15 Python
Python程序员面试题 你必须提前准备!(答案及解析)
2018/01/23 Python
PyCharm代码整体缩进,反向缩进的方法
2018/06/25 Python
python 随机生成10位数密码的实现代码
2019/06/27 Python
Python读写文件模式和文件对象方法实例详解
2019/09/17 Python
np.newaxis 实现为 numpy.ndarray(多维数组)增加一个轴
2019/11/30 Python
Python PyPDF2模块安装使用解析
2020/01/19 Python
Softmax函数原理及Python实现过程解析
2020/05/22 Python
办公文员的工作岗位职责
2013/11/12 职场文书
2014教师党员自我评议(5篇)
2014/09/20 职场文书
法学专业毕业实习自我鉴定2014
2014/09/27 职场文书
村主任个人对照检查材料
2014/10/01 职场文书
2014年社区工作总结
2014/11/18 职场文书
评先进个人材料
2014/12/29 职场文书
2015安全保卫工作总结
2015/04/25 职场文书
学生会招新宣传语
2015/07/13 职场文书
2019 入党申请书范文
2019/07/10 职场文书
基于Nginx实现限制某IP短时间访问次数
2021/03/31 Servers
教你用Java在个人电脑上实现微信扫码支付
2021/06/13 Java/Android