Vue相关

Vue交互

2016-11-29  本文已影响148人  星空有月

vue本身不支持交互,所以在交互时需要引入模块vue-resource.js

1.直接获取文件内的内容:

```

'use strict';

window.onload=function(){

new Vue({

el:'body',

data:{

a:12

},

methods:{

get:function(){

this.$http.get('a.txt').then(function(res){

console.log(res.data);

},function(err){alert(err)});

}

}

});

};

```

2.get通过get.php'

```

use strict';

window.onload=function(){

new Vue({

el:'body',

data:{

d:12

},

methods:{

get:function(){

this.$http.get('get.php',{'a':1,'b':4}).then(function(res){

console.log(res.data);

},function(err){console.log(err.status)});

}

}

});

};

```

3.post通过post.php'

```

use strict';

window.onload=function(){

new Vue({

el:'body',

data:{

a:1

},

methods:{

post:function(){

this.$http.post('post.php',{a:1,b:2},{emulateJSON:true}).then(function(res){alert(res.data)},function(err){console.log(err.data)});

}

}

});

```

};4.通过jsonp获取数据

```

'use strict';

window.onload=function(){

new Vue({

el:'body',

data:{

d:12

},

methods:{

get:function(){

this.$http.jsonp('https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?',{wd:4},{jsonp:'cb'}).then(function(res){

alert(res.data.s);

},function(err){console.log(err.status)});

}

}

});

};

```

上一篇 下一篇

猜你喜欢

热点阅读