vue-resourc发起异步请求的方法


Posted in Javascript onFebruary 11, 2020

除了vue-resource之外,还可以使用'axios‘的第三方包实现数据的请求因为跨域失败访问不到,不过同域的可以直接访问.html文件来检验,这样可以不用搭服务器建议使用axios来进行异步访问请求

1.安装或导入vue-resource

安装命令:

npm install vue-resource

导入:

import VueResource from 'vue-resource'
Vue.use(VueResource)

2.使用

格式:

this.http.get('/url',[options]).then(successCallback,errorCallback)

更多

get(url,[options])
post(url,[body],[options])
jsonp(url,[options])

具体使用:

get:

function(){
this.$http.get{'/访问地址'}.then(function(result){
//访问成功后的处理
},function(result){
//访问不成功的处理
})
}

post:

function(){
this.$http.post{'/访问地址',{},{emulateJSON:true}}.then(function(result){
//访问成功后的处理
},function(result){
//访问不成功的处理
})
}

jsonp:

function(){
this.$http.jsonp{'/访问地址'}.then(function(result){
//访问成功后的处理
},function(result){
//访问不成功的处理
})
}

result的数据使用推荐使用result.body下的数据

vue-resource提供的全局配置数据根域名的方法

作用

使发起请求时,请求地址不用再写根域名

方便移植设置全局根域名

//在Vue实例创建前定义
//注意:根域名后面需要带斜线
Vue.http.options.root='根域名/'

请求

//注意:地址前面不能带斜线
this.$http.get('a/a')
vue-resource提供的全局启用emulateJSON选项
//在Vue实例创建前定义
Vue.http.options.emulateJSON=true

总结

以上所述是小编给大家介绍的vue-resourc发起异步请求的方法,希望对大家有所帮助!

Javascript 相关文章推荐
fromCharCode和charCodeAt 方法
Dec 27 Javascript
javascript中的startWith和endWith的几种实现方法
May 07 Javascript
jQuery插件开发详细教程
Jun 06 Javascript
详解JavaScript编程中的数组结构
Oct 24 Javascript
第二章之Bootstrap 页面排版样式
Apr 25 Javascript
AngularJS使用ng-inlude指令加载页面失败的原因与解决方法
Jan 19 Javascript
JS实现延迟隐藏功能的方法(类似QQ头像鼠标放上展示信息)
Dec 28 Javascript
JS数组方法shift()、unshift()用法实例分析
Jan 18 Javascript
ElementUI 修改默认样式的几种办法(小结)
Jul 29 Javascript
vue自定义树状结构图的实现方法
Oct 18 Javascript
Vue页面渲染中key的应用实例教程
Jan 12 Vue.js
vue实现锚点定位功能
Jun 29 Vue.js
js实现圆形显示鼠标单击位置
Feb 11 #Javascript
JavaScript实现省份城市的三级联动
Feb 11 #Javascript
node.js使用yargs处理命令行参数操作示例
Feb 11 #Javascript
node.js实现http服务器与浏览器之间的内容缓存操作示例
Feb 11 #Javascript
node.js 使用 net 模块模拟 websocket 握手进行数据传递操作示例
Feb 11 #Javascript
JavaScript实现拖拽功能
Feb 11 #Javascript
node.js中 mysql 增删改查操作及async,await处理实例分析
Feb 11 #Javascript
You might like
用PHP实现ODBC数据分页显示一例
2006/10/09 PHP
php Http_Template_IT类库进行模板替换
2009/03/19 PHP
ezSQL PHP数据库操作类库
2010/05/16 PHP
PHP学习笔记之二
2011/01/17 PHP
phpstudy2020搭建站点的实现示例
2020/10/30 PHP
javascript SocialHistory 检查访问者是否访问过某站点
2008/08/02 Javascript
javascript检测浏览器flash版本的实现代码
2011/12/06 Javascript
jQuery的文档处理程序详解
2016/05/10 Javascript
javascript的函数劫持浅析
2016/09/26 Javascript
Vue.js绑定HTML class数组语法错误的原因分析
2016/10/19 Javascript
微信小程序 小程序制作及动画(animation样式)详解
2017/01/06 Javascript
webpack入门必知必会
2017/01/16 Javascript
详解node单线程实现高并发原理与node异步I/O
2017/09/21 Javascript
jquery ajax异步提交表单数据的方法
2017/10/27 jQuery
JavaScript通过mouseover()实现图片变大效果的示例
2017/12/20 Javascript
vue 对象添加或删除成员时无法实时更新的解决方法
2019/05/01 Javascript
vue 中 命名视图的用法实例详解
2019/08/14 Javascript
使用konva和vue-konva库实现拖拽滑块验证功能
2020/04/27 Javascript
如何使用JavaScript检测空闲的浏览器选项卡
2020/05/28 Javascript
Element Popover 弹出框的使用示例
2020/07/26 Javascript
JS实现点击掉落特效
2021/01/29 Javascript
[01:35]2018年度CS GO最佳战队-完美盛典
2018/12/17 DOTA
Python(TensorFlow框架)实现手写数字识别系统的方法
2018/05/29 Python
python3实现二叉树的遍历与递归算法解析(小结)
2019/07/03 Python
Python Numpy库datetime类型的处理详解
2019/07/13 Python
Python 写入训练日志文件并控制台输出解析
2019/08/13 Python
英国的知名精品百货公司:House of Fraser(福来德)
2016/08/14 全球购物
性能服装:HYLETE
2018/08/14 全球购物
Tuckernuck官网:经典的美国品质服装、鞋子和配饰
2021/01/11 全球购物
说出ArrayList,Vector, LinkedList的存储性能和特性
2015/01/04 面试题
大学班级文化建设方案
2014/05/06 职场文书
软件售后服务承诺书
2014/05/21 职场文书
信用卡结清证明怎么写
2014/09/13 职场文书
校园学雷锋广播稿
2014/10/08 职场文书
pytorch fine-tune 预训练的模型操作
2021/06/03 Python
Redis全局ID生成器的实现
2022/06/05 Redis