VUE- 訪問服務器端數據 Vue-resource

 

1. 安裝 vue-resource 

cnpm install vue-resource --save

 

 

安裝完畢后，在main.js中導入，如下所示：

import VueResource from 'vue-resource'; 

Vue.use(VueResource);  

 

 

get請求

 

 
var params = {params: {id: id}}
this.$http.get(url, params).then(function(res){
    // 響應成功回調
    var data = res.body;
    //數據在res.body里面
}, function(res){
    // 響應錯誤回調
});


//或

 　 this.$http.get(url, params)

 .then( response => { dataRes = response.data; }, response => {} // 發生錯誤 );

 

 

post請求

 

啟用{emulateJSON : true}選項后，請求會以application/x-www-form-urlencoded作為content-type,像HTML表單一樣。

this.$http.post(this.$config.PathHttpAuth + "/api/menu/DeleteMenu", {id: 12},{emulateJSON : true}) 
.then( 
function(res) { }, 
response => {} // 發生錯誤  
); 


[Route("DeleteMenu")] 
[HttpPost] 
public async Task<IActionResult> DeleteMenuAsync(dynamic param) {}



或

[Route("SaveMenu")]
[HttpPost]
public async Task<IActionResult> SaveMenuAsync(Tbmenu modelForm)
{}

 

 

JSONP 請求

 

 
var JSONparams ={
    params: {id: id}
    jsonp: 'callback' // 設置回調函數的參數的一個名字，默認是話是callback,
}
 this.$http.jsonp(url, JSONparams).then( (res) => {
    console.log(res);
}, (err) => {
    console.log(err);
}) 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

引用：https://blog.csdn.net/ant_dreams/article/details/80568420