基本语法
必须引入一个库：vue-resource github地址
// 基于全局Vue对象使用http Vue.http.get('/someUrl', [options]).then(successCallback, errorCallback);Vue.http.post('/someUrl', [body], [options]).then(successCallback, errorCallback);// 在一个Vue实例内使用$http this.$http.get('/someUrl', [options]).then(successCallback, errorCallback);this.$http.post('/someUrl', [body], [options]).then(successCallback, errorCallback);vue-resource的请求API是按照REST风格设计的，它提供了7种请求API：
get(url, [options]) head(url, [options]) delete(url, [options]) jsonp(url, [options]) post(url, [body], [options]) put(url, [body], [options]) patch(url, [body], [options])Options
| Parameter | Type | Description |
|---|---|---|
| url | string | 请求的UR |
| body | Object, FormData, string | request body |
| headers | Object | request header |
| params | Object | 请求的URL参数对象 |
| method | string | 请求的HTTP方法，例如：'GET', 'POST'或其他HTTP方法 |
| timeout | number | 单位为毫秒的请求超时时间 (0 表示无超时时间) |
| before | function(request) | 请求发送前的处理函数，类似于jQuery的beforeSend函数 |
| progress | function(event) | ProgressEvent回调处理函数 |
| credentials | boolean | 表示跨域请求时是否需要使用凭证 |
| emulateHTTP | boolean | 发送PUT, PATCH, DELETE请求时以HTTP POST的方式发送，并设置请求头的X-HTTP-Method-Override |
| emulateJSON | boolean | 将request body以application/x-www-form-urlencoded content type发送 |
1. 向文本发出get请求
准备一个1.txt 的文本数据，时面的内容是：welcomet to vue!!!
<!DOCTYPE html><html><head> <title></title> <meta charset="utf-8"> <script src="http://unpkg.com/vue/dist/vue.js"></script> <script src="http://files.cnblogs.com/files/zycbloger/vue-resource.min.js"></script> <script type="text/javascript"> window.onload = function(){ var vm = new Vue({ el:'#box', data:{ msg:'Hello World!', }, methods:{ get:function(){ //发送get请求 this.$http.get('1.txt').then(function(res){ alert(res.body); },function(){ alert('请求失败处理'); //失败处理 }); } } }); } </script></head><body> <div id="box"> <input type="button" @click="get()" value="按钮"> </div></body></html>
新闻热点
疑难解答
图片精选
