vue-resource发起get、post、jsonp请求

1、vue-resource发起get请求
1 get请求定义

getInfo(){
	//当发起get请求之后,通过.then 来设置成功的回调函数
	this.$http.get('http://localhost/day05/code/08-ajax-post.html').then(function(result){
	//通过result.body 获得服务器返回的成功数据
		console.log(result.body)
	})
}
 2 get请求使用
<input type="button" value="get请求" @click="getInfo"/>

2、vue-resource发起post请求
1 post请求定义

postInfo(){ //发起post请请求,应该用表单格式, application/x-www-form-urlencoded
	//手动发起的 post 请求,默认没有表单格式,有的服务器处理不了
	// 通过post 方法的第三个参数,{emulateJSON:true} 设置 提交的内容类型为 普通表单格式
	this.$http.post('http://vue.studyit.io/api/post',{},{emulateJSON:true}).then(result=>{
		console.log(result.body)
	})
},

2 get请求使用

<input type="button" value="post请求" @click="postInfo"/>

3、vue-resource发起jsonp请求
1 jsonp请求定义

jsonpInfo(){
	this.$http.jsonp('http://vue.studyit.io/api/jsonp').then(result=>{
		console.log(result.body)
	})
}

2 jsonp请求使用

<input type="button" value="jsonp请求" @click="jsonpInfo"/>

你可能感兴趣的:(vue)