一、vue-resource 的 GET/POST 请求
1. vue-resource 的 GET 请求
var vm = new Vue({
el: '#app',
data: {
resp: {},
api_url: '/index',
},
methods: {
get_data(){
this.$http.get(this.api_url)
.then((response) => {
// 用 set 将响应结果赋给变量 resp
this.$set(this.resp,'data',response.body)
}).catch(function(response){console.log(response)})
}
}
})
2. vue-resource 的 POST 请求
var vm = new Vue({
el: '#app',
data: {
resp: {},
post_data: {'name':'abc'},
api_url: '/index',
},
methods: {
get_data(){
this.$http.post(this.api_url,this.post_data,{emulateJSON:true})
.then((response) => {this.$set(this.resp,'data',response.body)})
.catch(function(response){console.log(response)})
}
}
})
二、Vue 中 axios 的 GET/POST 请求
1. axios 的 GET 请求
var vm= new Vue({
el: '#app',
data: {
resp: {},
ret_data: null,
api_url: '/index',
},
methods: { // 定义方法
get_data(){
axios.get(this.api_url).then(
resp => {
let data = JSON.parse(resp.data)
this.$set(this.resp,'data',data)
this.ret_data = data
}).catch(err => console.log(err))
}
}
})
2. axios 的 POST 请求
var vm= new Vue({
el: '#app',
data: {
resp: {},
ret_data: null,
post_data: {'name':'abc'},
api_url: '/index',
},
methods: { // 定义方法
get_data(){
axios.post(this.api_url, this.post_data).then(
resp => {
let data = JSON.parse(resp.data)
this.$set(this.resp,'data',data)
this.ret_data = data
}).catch(err => console.log(err))
}
}
})
三、jQuery 的 GET/POST 请求
1. jQuery 的 GET 请求
$(function(){
$("#btn").click(function(){
$.ajax({
url:"/index",
dataType:"json",
data:{name:'abc'},
type:"get",
success:function(resp){
var result
result = JSON.parse(resp);
}
})
})
})
2. jQuery 的 POST 请求
$("btn").click(function(){
$.post(url,{user:'abc',pwd:'******'},function(resp){
if(resp.success){
$.messager.alert("系统提示","添加成功","info");
}else{
$.messager.alert("系统提示","添加失败","error");
}
},"json");
}