基于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 相关文章推荐
this[] 指的是什么内容 讨论
Mar 24 Javascript
JavaScript 权威指南(第四版) 读书笔记
Aug 11 Javascript
javascript+css 网页每次加载不同样式的实现方法
Dec 27 Javascript
jQuery学习笔记之jQuery选择器的使用
Dec 22 Javascript
IE8提示Invalid procedure call or argument 异常的解决方法
Sep 30 Javascript
jquerymobile局部渲染的各种刷新方法小结
Mar 05 Javascript
jQuery淡入淡出元素让其效果更为生动
Sep 01 Javascript
javascript中的this详解
Dec 08 Javascript
JS实现动态给图片添加边框的方法
Apr 01 Javascript
易被忽视的js事件问题总结
May 14 Javascript
es6数值的扩展方法
Mar 11 Javascript
Vue中使用better-scroll实现轮播图组件
Mar 07 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中处理模拟rewrite 效果
2006/12/09 PHP
php 操作数组(合并,拆分,追加,查找,删除等)
2012/07/20 PHP
PHP查询网站的PR值
2013/10/30 PHP
PHP生成随机密码类分享
2014/06/25 PHP
php用正则判断是否为数字的方法
2016/03/25 PHP
php  单例模式详细介绍及实现源码
2016/11/05 PHP
PHP+Apache环境中如何隐藏Apache版本
2017/11/24 PHP
PHP内部实现打乱字符串顺序函数str_shuffle的方法
2019/02/14 PHP
JavaScript 保存数组到Cookie的代码
2010/04/14 Javascript
Jquery上传插件 uploadify v3.1使用说明
2012/06/18 Javascript
原生JavaScript生成GUID的实现示例
2014/09/05 Javascript
javascript和jquery实现设置和移除文本框默认值效果代码
2015/01/13 Javascript
jquery使用animate方法实现控制元素移动
2015/03/27 Javascript
jQuery中Ajax全局事件引用方式及各个事件(全局/局部)执行顺序
2016/06/02 Javascript
给Easyui-Datebox设置隐藏或者不可用的解决方法
2017/05/26 Javascript
JS动态插入脚本和插入引用外部链接脚本的方法
2018/05/21 Javascript
JavaScript实现的反序列化json字符串操作示例
2018/07/18 Javascript
vue 中的keep-alive实例代码
2018/07/20 Javascript
使用Node搭建reactSSR服务端渲染架构
2018/08/30 Javascript
CentOS7中源码编译安装NodeJS的完整步骤
2018/10/13 NodeJs
layui实现数据表格隐藏列的示例
2019/10/25 Javascript
python使用pil生成图片验证码的方法
2015/05/08 Python
python与C互相调用的方法详解
2017/07/14 Python
解决Python字典写入文件出行首行有空格的问题
2017/09/27 Python
Python编程之黑板上排列组合,你舍得解开吗
2017/10/30 Python
opencv改变imshow窗口大小,窗口位置的方法
2018/04/02 Python
python 处理telnet返回的More,以及get想要的那个参数方法
2019/02/14 Python
python+mysql实现教务管理系统
2019/02/20 Python
PyTorch实现更新部分网络,其他不更新
2019/12/31 Python
Python递归求出列表(包括列表中的子列表)的最大值实例
2020/02/27 Python
手把手教你配置JupyterLab 环境的实现
2021/02/02 Python
John Varvatos官方网站:设计师男士时装
2017/02/08 全球购物
全球知名的珠宝首饰品牌:Kay Jewelers
2018/02/11 全球购物
创业计划书如何编写
2014/02/06 职场文书
党的群众路线教育实践活动方案
2014/10/31 职场文书
教师节寄语2015
2015/03/23 职场文书