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 相关文章推荐
Js基础学习资料
Nov 23 Javascript
读取input:file的路径并显示本地图片的方法
Sep 23 Javascript
js实现通用的微信分享组件示例
Mar 10 Javascript
javascript实现详细时间提醒信息效果的方法
Mar 11 Javascript
JavaScript中停止执行setInterval和setTimeout事件的方法
May 14 Javascript
jQuery获取页面元素绝对与相对位置的方法
Jun 10 Javascript
Node.js学习之TCP/IP数据通讯(实例讲解)
Oct 11 Javascript
JS实现定时任务每隔N秒请求后台setInterval定时和ajax请求问题
Oct 15 Javascript
详解小程序中h5页面onShow实现及跨页面通信方案
May 30 Javascript
vue filter 完美时间日期格式的代码
Aug 14 Javascript
Echarts地图添加引导线效果(labelLine)
Sep 30 Javascript
Vue如何实现监听组件原生事件
Jul 03 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中设置一个严格30分钟过期Session面试题的4种答案
2014/07/30 PHP
php上传文件并显示上传进度的方法
2015/03/24 PHP
Yii实现简单分页的方法
2016/04/29 PHP
php网页版聊天软件实现代码
2016/08/12 PHP
js禁止页面刷新禁止用F5键刷新禁止右键的示例代码
2013/09/23 Javascript
JS禁用浏览器退格键实现思路及代码
2013/10/29 Javascript
js获取当前路径的简单示例代码
2014/01/08 Javascript
js 金额格式化来回转换示例
2014/02/23 Javascript
jquery事件preventDefault()方法用法实例
2015/01/16 Javascript
AngularJS模块详解及示例代码
2016/08/17 Javascript
jQuery用户头像裁剪插件cropbox.js使用详解
2017/06/07 jQuery
简单实现jQuery轮播效果
2017/08/18 jQuery
浅谈Angular 的变化检测的方法
2018/03/01 Javascript
layui固定下拉框的显示条数(有滚动条)的方法
2019/09/10 Javascript
浅谈v-for 和 v-if 并用时筛选条件方法
2019/11/07 Javascript
JavaScript实现音乐导航效果
2020/11/19 Javascript
如何在JavaScript中正确处理变量
2020/12/25 Javascript
python中关于日期时间处理的问答集锦
2013/03/08 Python
Python open()文件处理使用介绍
2014/11/30 Python
python基于pyDes库实现des加密的方法
2017/04/29 Python
python机器学习之神经网络(三)
2017/12/20 Python
tornado 多进程模式解析
2018/01/15 Python
解决python3 urllib 链接中有中文的问题
2018/07/16 Python
python添加模块搜索路径和包的导入方法
2019/01/19 Python
PyQt5通信机制 信号与槽详解
2019/08/07 Python
如何使用python3获取当前路径及os.path.dirname的使用
2019/12/13 Python
使用python求解二次规划的问题
2020/02/29 Python
美国山地自行车、露营、户外装备和服装购物网站:Aventuron
2018/05/05 全球购物
香港中原电器网上商店:Chung Yuen
2019/06/26 全球购物
Java程序员面试题
2013/07/15 面试题
总裁岗位职责
2013/12/04 职场文书
电脑租赁公司创业计划书
2014/01/08 职场文书
美术课外活动总结
2014/07/08 职场文书
教师党的群众路线教育实践活动个人对照检查材料
2014/09/23 职场文书
走近毛泽东观后感
2015/06/04 职场文书
SQL Server中的游标介绍
2022/05/20 SQL Server