Vue可以使用vue-resource實現ajax的操作 ， 需要額外庫
Vue.js 2.0 版本推薦使用 axios 來完成 ajax 請求

引用庫 :

<script src="https://cdn.staticfile.org/vue-resource/1.5.1/vue-resource.min.js"></script>

示例 :

get示例

<script>
window.onload = function(){
    var vm = new Vue({
        el:'#box',
        data:{
            msg:
 
'Hello World!',
        },
        methods:{
            get:function(){
                //傳送get請求
                this.$http.get('/try/ajax/ajax_info.txt').then(function(res){
                    document.write(res.body);    
                },function(){
                    console.log('請求失敗處理');
                });
                
 
/*
                 *  加引數的方式 : 
                 *    this.$http.get('get.php',{params : {a:1,b:2}}).then(function(res){
                 *        document.write(res.body);    
                 *    },function(res){
                 *        console.log(res.status);
                 *    });
                 
 
*/
            }
        }
    });
}
</script>

post示例

post 傳送資料到後端，需要第三個引數 {emulateJSON:true
emulateJSON 的作用： 如果Web伺服器無法處理編碼為 application/json 的請求，你可以啟用 emulateJSON 選項
演示 ： https://www.runoob.com/try/try.php?filename=vue2-ajax2

<script>
window.onload = function(){
    var vm = new Vue({
        el:'#box',
        data:{
            msg:'Hello World!',
        },
        methods:{
            post:function(){
                //傳送 post 請求
                this.$http.post('/try/ajax/demo_test_post.php',{name:"菜鳥教程",url:"http://www.runoob.com"},{emulateJSON:true}).then(function(res){
                    document.write(res.body);    
                },function(res){
                    console.log(res.status);
                });
            }
        }
    });
}
</script>

語法 & API :

<script>
// 基於全域性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);
</script>

vue-resource 提供了 7 種請求 API(REST 風格)：

get(url, [options])
head(url, [options])
delete(url, [options])
jsonp(url, [options])              //就這一個不是標準的 HTTP 方法
post(url, [body], [options])
put(url, [body], [options])
patch(url, [body], [options])

除了 jsonp 以外，另外 6 種的 API 名稱是標準的 HTTP 方法。
options 引數說明:

通過如下屬性和方法處理一個請求獲取到的響應物件: