基于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+XML 操作
Sep 20 Javascript
js 鼠标拖动对象 可让任何div实现拖动效果
Nov 09 Javascript
jquery 输入框数字限制插件
Nov 10 Javascript
学习JavaScript的最佳方法分享
Oct 21 Javascript
Javascript this 的一些学习总结
Aug 02 Javascript
js 获取、清空input type=&quot;file&quot;的值示例代码
Feb 19 Javascript
JQuery 图片滚动轮播示例代码
Mar 24 Javascript
jQuery事件的绑定、触发、及监听方法简单说明
May 10 Javascript
在knockoutjs 上自己实现的flux(实例讲解)
Dec 18 Javascript
Vue多组件仓库开发与发布详解
Feb 28 Javascript
jQuery中实现text()的方法
Apr 04 jQuery
详解React的回调渲染模式
Sep 10 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中get_headers函数的作用及用法的详细介绍
2013/04/27 PHP
在Windows XP下安装Apache+MySQL+PHP环境
2015/02/22 PHP
简单谈谈php浮点数精确运算
2016/03/10 PHP
PHP观察者模式实例分析【对比JS观察者模式】
2019/05/22 PHP
如何在Laravel之外使用illuminate组件详解
2020/09/20 PHP
jquery.validate使用攻略 第三部
2010/07/01 Javascript
javascript学习笔记(四) Number 数字类型
2012/06/19 Javascript
使用jquery的ajax需要注意的地方dataType的设置
2013/08/12 Javascript
jquery通过a标签删除table中的一行的代码
2013/12/02 Javascript
js的window.showModalDialog及window.open用法实例分析
2015/01/29 Javascript
Ionic快速安装教程
2016/06/03 Javascript
JavaScript鼠标特效大全
2016/09/13 Javascript
jQuery checkbox选中问题之prop与attr注意点分析
2016/11/15 Javascript
打字效果动画的4种实现方法(超简单)
2017/10/18 Javascript
在微信小程序中渲染HTML内容的方法示例
2018/09/28 Javascript
利用Electron简单撸一个Markdown编辑器的方法
2019/06/10 Javascript
使用Karma做vue组件单元测试的实现
2020/01/16 Javascript
JS实现进度条动态加载特效
2020/03/25 Javascript
基于vue+element实现全局loading过程详解
2020/07/10 Javascript
Vue跨域请求问题解决方案过程解析
2020/08/07 Javascript
详解Vue2的diff算法
2021/01/06 Vue.js
简单使用Python自动生成文章
2014/12/25 Python
Python中map和列表推导效率比较实例分析
2015/06/17 Python
Python的Django框架中从url中捕捉文本的方法
2015/07/20 Python
Python向excel中写入数据的方法
2019/05/05 Python
python3.7 的新特性详解
2019/07/25 Python
Python Django简单实现session登录注销过程详解
2019/08/06 Python
Python倒排索引之查找包含某主题或单词的文件
2019/11/13 Python
如何利用python进行时间序列分析
2020/08/04 Python
python中@contextmanager实例用法
2021/02/07 Python
英国著名书店:Foyles
2018/12/01 全球购物
医院总经理职责
2013/12/26 职场文书
高三地理教学反思
2014/01/11 职场文书
项目建议书范文
2014/05/12 职场文书
企业党员岗位承诺书
2015/04/27 职场文书
小米11和iphone12哪个值得买?小米11对比iphone12评测
2021/04/21 数码科技