Vue resource中的GET与POST请求的实例代码


Posted in Javascript onJuly 21, 2017

前言:vue-resource 使用比 jQuery 更加简洁的方式实现了异步请求功能,还提供了比如 interceptors 这样处理请求过程中行为的功能。下面介绍下vue-resource中常用的GET与POST请求使用与封装方法。

访问 Github 获取最新的开发文件与文档

特征:

  1. 支持 Promise API 和 URI Templates
  2. 支持请求过程中使用拦截器(interceptoers)
  3. 支持 Firefox,Chrome,Safari,Opera 和 IE9+
  4. 非常的小(压缩后之后14KB,在启用 gzipped后只有5.3KB)

参数说明:

参数说明很多文章里面所已经说过了,这里只使用必须用到的参数,具体请访问 Github 中的 Document

GET请求

function getRequest(url, params) {
 return new Promise((resolve, reject) => {
  Vue.http.get(
   url,
   {
    params: params
   },
   {emulateJSON: true}
  )
  .then((res) => {
   resolve(res);
  })
  .catch((res) => {
   reject(res);
  });
 });
}

POST请求

function postRequest(url, params) {
 return new Promise((resolve, reject) => {
  Vue.http.post(
   url,
   {
    params
   },
   {emulateJSON: true}
  )
  .then((res) => {
   resolve(res.body);
  })
  .catch((res) => {
   reject(res.body);
  });
 });
}

使用方法

var params = new Object(); //创建params对象
var params.id = id; //传递参数
var url = url; //url地址
postRequest(url, params)
.then((message) => {
 //这里处理成功回调
})
.catch((message) => {
 //这里处理失败回调
});

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Express.JS使用详解
Jul 17 Javascript
JavaScript中的toLocaleLowerCase()方法使用详解
Jun 06 Javascript
PhantomJS快速入门教程(服务器端的 JavaScript API 的 WebKit)
Aug 06 Javascript
jQuery Ajax 加载数据时异步显示加载动画
Aug 01 Javascript
JavaScript定义数组的三种方法(new Array(),new Array('x','y')
Oct 04 Javascript
jquery点击展示与隐藏更多内容
Dec 03 Javascript
jQuery 添加样式属性的优先级别方法(推荐)
Jun 08 jQuery
JavaScript+H5实现微信摇一摇功能
May 23 Javascript
js将URL网址转为16进制加密与解密函数
Mar 04 Javascript
vue 使用localstorage实现面包屑的操作
Nov 16 Javascript
js实现验证码干扰(动态)
Feb 23 Javascript
JavaScript选择器函数querySelector和querySelectorAll
Nov 27 Javascript
Angular+Bootstrap+Spring Boot实现分页功能实例代码
Jul 21 #Javascript
es7学习教程之Decorators(修饰器)详解
Jul 21 #Javascript
VUE中使用Vue-resource完成交互
Jul 21 #Javascript
es7学习教程之fetch解决异步嵌套问题的方法示例
Jul 21 #Javascript
js图片轮播插件的封装
Jul 21 #Javascript
Javascript es7中比较实用的两个方法示例
Jul 21 #Javascript
AngularJS中使用three.js的实例详解
Jul 21 #Javascript
You might like
第十三节 对象串行化 [13]
2006/10/09 PHP
跟我学Laravel之配置Laravel
2014/10/15 PHP
PHP如何使用Memcached
2016/04/05 PHP
Yii框架表单模型和验证用法
2016/05/20 PHP
jquery下动态显示jqGrid以及jqGrid的属性设置容易出现问题的解决方法
2010/10/22 Javascript
js定时器的使用(实例讲解)
2014/01/06 Javascript
JavaScript 异常处理 详解
2015/02/06 Javascript
JQuery实现级联下拉框效果实例讲解
2015/09/17 Javascript
Bootstrap零基础入门教程(三)
2016/07/18 Javascript
很棒的js Tab选项卡切换效果
2016/08/30 Javascript
vue如何使用 Slot 分发内容实例详解
2017/09/05 Javascript
深入研究React中setState源码
2017/11/17 Javascript
vue 标签属性数据绑定和拼接的实现方法
2018/05/17 Javascript
vue中选项卡点击切换且能滑动切换功能的实现代码
2018/11/25 Javascript
vue-cli 3.x配置跨域代理的实现方法
2019/04/12 Javascript
javascript运行机制之执行顺序理解
2020/08/03 Javascript
[47:50]Secret vs VP 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/20 DOTA
详解Python的Django框架中的中间件
2015/07/24 Python
深入了解Python数据类型之列表
2016/06/24 Python
python+opencv实现动态物体识别
2018/01/09 Python
flask-socketio实现WebSocket的方法
2018/07/31 Python
Python机器学习之scikit-learn库中KNN算法的封装与使用方法
2018/12/14 Python
pytorch使用指定GPU训练的实例
2019/08/19 Python
python自动化UI工具发送QQ消息的实例
2019/08/27 Python
详解Python中的format格式化函数的使用方法
2019/11/20 Python
Python3 使用map()批量的转换数据类型,如str转float的实现
2019/11/29 Python
Python表达式的优先级详解
2020/02/18 Python
PyCharm+Pipenv虚拟环境开发和依赖管理的教程详解
2020/04/16 Python
通过Python实现一个简单的html页面
2020/05/16 Python
keras分类之二分类实例(Cat and dog)
2020/07/09 Python
如何配置、使用和清除Smarty缓存
2015/12/23 面试题
《搭石》教学反思
2014/04/07 职场文书
学习教师敬业奉献模范事迹材料思想汇报
2014/09/19 职场文书
遗嘱范文
2015/08/07 职场文书
导游词之大雁塔景区
2019/09/17 职场文书
Java线程的6种状态与生命周期
2022/05/11 Java/Android