基于Vue的ajax公共方法(详解)


Posted in Javascript onJanuary 20, 2018

为了减少代码的冗余,决定抽离出请求ajax的公共方法,供同事们使用。

我使用了ES6语法,编写了这个方法。

/**
  * @param type 请求类型,分为POST/GET
  * @param url 请求url
  * @param contentType
  * @param headers
  * @param data
  * @returns {Promise<any>}
  */
 ajaxData: function (type, url, contentType, headers, data) {
  return new Promise(function(resolve) {
   $.ajax({
    type: type,
    url: url,
    data: data,
    timeout: 30000, //超时时间:10秒
    headers: headers,
    success: function(data) {
     resolve(data);
    },
    error: function(XMLHttpRequest, textStatus, errorThrown) {
     resolve(XMLHttpRequest);
    }
   });
  });
 }

通过回调函数的方式返回请求结果。

测试代码如下:

getAjaxDataMethod: function () {
    const url = "";
    const type = "POST";
    const contentType = "application/json";
    const headers = {};
    const data = {};
    Api.ajaxData(type, url, contentType, headers, data).then(function (res) {
     console.log(res);
    }).catch(function (err) {
     console.log(err);
    })
   }

测试通过!

以上这篇基于Vue的ajax公共方法(详解)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
根据json字符串生成Html的一种方式
Jan 09 Javascript
jQuery教程 $()包装函数来实现数组元素分页效果
Aug 13 Javascript
js中运算符&amp;&amp; 和 || 的使用记录
Aug 21 Javascript
js实现格式化金额,字符,时间的方法
Feb 26 Javascript
使用AmplifyJS组件配合JavaScript进行编程的指南
Jul 28 Javascript
用jQuery.ajaxSetup实现对请求和响应数据的过滤
Dec 20 Javascript
webstorm中vue语法的支持详解
May 09 Javascript
使用vue-infinite-scroll实现无限滚动效果
Jun 22 Javascript
jQuery选择器之基本过滤选择器用法实例分析
Feb 19 jQuery
使用vue开发移动端管理后台的注意事项
Mar 07 Javascript
eslint 的三大通用规则详解
May 16 Javascript
JavaScript的console命令使用实例
Dec 03 Javascript
详解vue.js数据传递以及数据分发slot
Jan 20 #Javascript
Angular2整合其他插件的方法
Jan 20 #Javascript
详解Angular结合zTree异步加载节点数据
Jan 20 #Javascript
javascript数组拍平方法总结
Jan 20 #Javascript
node.js文件上传重命名以及移动位置的示例代码
Jan 19 #Javascript
详解Node.js模板引擎Jade入门
Jan 19 #Javascript
JS实现碰撞检测的方法分析
Jan 19 #Javascript
You might like
用PHP 4.2书写安全的脚本
2006/10/09 PHP
基于simple_html_dom的使用小结
2013/07/01 PHP
php中将一段数据存到一个txt文件中并显示其内容
2014/08/15 PHP
PHP调用Mailgun发送邮件的方法
2017/05/04 PHP
jquery移除button的inline onclick事件(已测试及兼容浏览器)
2013/01/25 Javascript
js获取某月的最后一天日期的简单实例
2013/06/22 Javascript
JavaScript中DOM详解
2015/04/13 Javascript
jQuery中$.ajax()和$.getJson()同步处理详解
2015/08/12 Javascript
javascript与jquery中的this关键字用法实例分析
2015/12/24 Javascript
jQuery+css实现的换页标签栏效果
2016/01/27 Javascript
AngularJS动态加载模块和依赖的方法分析
2016/11/08 Javascript
JS简单判断滚动条的滚动方向实现方法
2017/04/28 Javascript
JavaScript登录验证基础教程
2017/11/01 Javascript
Koa2微信公众号开发之消息管理
2018/05/16 Javascript
json前后端数据交互相关代码
2018/09/19 Javascript
Vue CLI 3搭建vue+vuex最全分析(推荐)
2018/09/27 Javascript
微信小程序实现折线图的示例代码
2019/06/07 Javascript
微信小程序自定义组件实现环形进度条
2020/11/17 Javascript
JS实现打字游戏
2019/12/17 Javascript
vue中使用WX-JSSDK的两种方法(推荐)
2020/01/18 Javascript
JavaScript对象原型链原理解析
2020/01/22 Javascript
Python中用PIL库批量给图片加上序号的教程
2015/05/06 Python
python3 与python2 异常处理的区别与联系
2016/06/19 Python
python基于itchat实现微信群消息同步机器人
2017/02/27 Python
对Python中range()函数和list的比较
2018/04/19 Python
下载官网python并安装的步骤详解
2019/10/12 Python
HTML5自定义元素播放焦点图动画的实现
2019/09/25 HTML / CSS
欧舒丹比利时官网:L’OCCITANE比利时
2017/04/25 全球购物
Electric官网:美国高级眼镜和配件品牌
2020/06/04 全球购物
网络工程师面试(三木通信技术有限公司)
2013/06/05 面试题
秋天的怀念教学反思
2014/04/28 职场文书
2014标准社保办理委托书
2014/10/06 职场文书
晋江市人民政府党组群众路线教育实践活动整改方案
2014/10/25 职场文书
学校艾滋病宣传活动总结
2015/05/09 职场文书
Redis主从复制操作和配置详情
2022/09/23 Redis
码云(gitee)通过git自动同步到阿里云服务器
2022/12/24 Servers