基于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 相关文章推荐
Js数组的操作push,pop,shift,unshift等方法详细介绍
Dec 28 Javascript
JavaScript中数组对象的那些自带方法介绍
Mar 12 Javascript
JS打开层/关闭层/移动层动画效果的实例代码
May 11 Javascript
JavaScript判断undefined类型的正确方法
Jun 30 Javascript
js将table的每个td的内容自动赋值给其title属性的方法
Oct 13 Javascript
js禁止浏览器的回退事件
Apr 20 Javascript
Vue2实时监听表单变化的示例讲解
Aug 30 Javascript
详解webpack 热更新优化
Sep 13 Javascript
在vue中使用echarts图表实例代码详解
Oct 22 Javascript
vue 组件销毁并重置的实现
Jan 13 Javascript
解决vue-loader加载不上的问题
Oct 21 Javascript
动态规划之使用备忘录来改进Javascript函数
Apr 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
用IE远程创建Mysql数据库的简易程序
2006/10/09 PHP
php安全之直接用$获取值而不$_GET 字符转义
2012/06/03 PHP
PHPThumb图片处理实例
2014/05/03 PHP
对于ThinkPHP框架早期版本的一个SQL注入漏洞详细分析
2014/07/04 PHP
PHP实现对文本数据库的常用操作方法实例演示
2014/07/04 PHP
了解PHP的返回引用和局部静态变量
2015/06/04 PHP
PHP使用pear自带的mail类库发邮件的方法
2015/07/08 PHP
PHP中单例模式与工厂模式详解
2017/02/17 PHP
HTML 自动伸缩的表格Table js实现
2009/04/01 Javascript
五个jQuery图片画廊插件 推荐
2011/05/12 Javascript
Jquery动态进行图片缩略的原理及实现
2013/08/13 Javascript
jquery选择器、属性设置用法经验总结
2013/09/08 Javascript
点击弹出层效果&amp;弹出窗口后网页背景变暗效果的实现代码
2014/02/10 Javascript
JavaScript中的Math.E属性使用详解
2015/06/12 Javascript
js实现的倒计时按钮实例
2015/06/24 Javascript
浏览器环境下JavaScript脚本加载与执行探析之动态脚本与Ajax脚本注入
2016/01/19 Javascript
JS中type=&quot;button&quot;和type=&quot;submit&quot;的区别
2017/07/04 Javascript
JS笛卡尔积算法与多重数组笛卡尔积实现方法示例
2017/12/01 Javascript
详解vuex的简单使用
2018/03/12 Javascript
vue2 设置router-view默认路径的实例
2018/09/20 Javascript
JavaScript中this函数使用实例解析
2020/02/21 Javascript
vue从后台渲染文章列表以及根据id跳转文章详情详解
2020/12/14 Vue.js
Python中用于计算对数的log()方法
2015/05/15 Python
python实现井字棋游戏
2020/03/30 Python
Python输出\u编码将其转换成中文的实例
2018/12/15 Python
Python 调用PIL库失败的解决方法
2019/01/08 Python
Python 保持登录状态进行接口测试的方法示例
2019/08/06 Python
python实现处理mysql结果输出方式
2020/04/09 Python
Python求解排列中的逆序数个数实例
2020/05/03 Python
互斥锁解决 Python 中多线程共享全局变量的问题(推荐)
2020/09/28 Python
python 装饰器的基本使用
2021/01/13 Python
动员大会主持词
2014/03/20 职场文书
任命书模板
2014/06/04 职场文书
专题组织生活会方案
2014/06/15 职场文书
民事诉讼授权委托书范文
2014/08/02 职场文书
浅谈Golang 嵌套 interface 的赋值问题
2021/04/29 Golang