vue.js-vue-resource笔记

/ 前端 / 无站内评论 / 332浏览
这个模块类似jq的ajax,就是一个异步请求的模块。
CDN地址:http://www.bootcdn.cn/vue-resource/

快速使用:

<a v-on:click='get'>get请求</a>
<a v-on:click='post'>post请求</a>
new Vue({
    el: "#app",
    data:{
msg:[]
},
http:{
//一个全局地址,在后面的请求url中可以忽略前缀
root:'https://xxxxxxx.qunar.com/api/'
},
methods:{
   get:function(){
//get请求,第一个参数是请求的url,params里面填写请求的参数。必须在params中写
this.$http.get('xxxx.json',{
params:{
userId:'1001'
},
headers:{
//放在请求体中
token:'xxxx'
}
}).then(function(res){
this.msg=res.data;
//res.data是异步请求的结果数据,赋值给msg。
},error(function(){
//失败回调函数
}));
},
post:function(){
//第一个参数是url地址,第二个参数直接写请求数据
this.$http.post('xxxx.json',{
userid:'1001'
},{
//配置参数
headers:{
token:'xxxx'
}
}).then(function(res){
//把结果赋值给msg
this.msg=res.data;
}.error(function(){
//失败回调
}));
},
jsonp:function(){
this.$http.jsonp('xxxxxx?id=xxx',{
//请求参数
params:{
userId:'1001'
}
}).then(function(res){
//获取结果参数
this.msg=res.data;
}.error(function(){
//失败回调
}));
}
}
});
召唤蕾姆
琼ICP备18000156号

鄂公网安备 42011502000211号