vue-resource
官网：https://github.com/pagekit/vue-resource
cdn:
<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
get请求：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="vue.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
</head>
<body>
<div id="app">
{{obj | json}}
<button @click='getdata'>get请求</button>
</div>
</body>
<script>
new Vue({
el:'#app',
data:{
obj:null,
},
methods:{
getdata(){
var url = 'http://baike.baidu.com/api/openapi/BaikeLemmaCardApi?scope=103&format=json&appid=379020&bk_key=%E5%85%B3%E9%94%AE%E5%AD%97&bk_length=600';
this.$http.get(url)
.then(function(response){
this.obj = response.body;
})
}
}
})
</script>
</html>post请求
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="vue.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
</head>
<body>
<div id="app">
<button @click='postdata'>post请求</button>
</div>
</body>
<script>
new Vue({
el:'#app',
methods:{
postdata(){
var url = '.....';
this.$http.post(url,{name:'...',id:'....'}，{emulateJSON:true}).then((response)=>{
alert(response.body.message);
})
}
}
})
</script>
</html>jsonp
jsonp(url, [config])