ajax：
获取普通文本数据
this.$http.get('a.txt').then(function (res) {
alert(res.data);
},function (res) {
alert(res.status);
})
给服务器发送get数据--OK
this.$http.get('get.php',{
params:{ 必须有params
a:1,
b:2
}
},{emulateJSON:true}).then(function (res) {
alert(res.data);
},function (res) {
alert(res.status);
})
给服务器发送post数据-OK
this.$http.post('post.php',{
a:3,
b:2
},{
emulateJSON:true
}).then(function (res) {
alert(res.data);
},function (res) {
alert(res.status);
})
jsonp跨域-OK
this.$http.jsonp('https://sug.so.360.cn/suggest',{
params:{
word:'a'
}
},{
emulateJSON:true
}).then(function (res) {
alert(res.data.s);
},function (res) {
alert(res.status);
})
跨域,更改callback
this.$http.jsonp('https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su',{
params:{
wd:'a'
},
jsonp:'cb' 默认为callback
}).then(function (res) {
alert(res.data.s);
},function (res) {
alert(res.status);
})
简易百度搜索：
<script>
window.onload=function () {
new Vue({
el:'#box',
data:{
myData:[],
t1:''
},
methods:{
get:function () {
this.$http.jsonp('https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su',{
params:{
wd:this.t1
},
jsonp:'cb'
}).then(function (res) {
this.myData=res.data.s;
},function (res) {
alert(res.status);
})
}
}
});
};
</script>
</head>
<body>
<div id="box">
<input type="text" v-model="t1" @keyup="get()">
<ul>
<li v-for="(value,index) in myData">{{value}}</li>
</ul>
<p v-show="myData.length==0">暂无数据</p>
</div>
</body>
</html>