vue中get和post請求的區(qū)別點總結
本教程操作環(huán)境:windows7系統(tǒng)、vue2.9.6版,DELL G3電腦。
vue中get和post請求的區(qū)別
1、get請求
在GET請求中參數是跟在URL后面,即參數放在header中。能傳的參數較小。使用params。
this.$http.get(' URL ').then(result=>{
if(result.status===0){
// 成功了
this.list=result.message;
// 這里是假設被請求的數據表中的列表名稱為message
}else{
// 失敗了 ,彈出窗體警告
alert("數據請求失敗");
}
})
2、post請求
在POST請求中參數是放在body中,并不跟在URL后面。使用data,傳遞的參數較大。
this.$http.post('URL',{id:this.id},{emulateJSON:true})..then(result=>{
if(result.body.status===0){
// 成功了
}else{
// 失敗了
alert("獲取數據失??!");
]
})
知識點擴展:
vue 使用post/get 下載導出文件操作
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>前端項目下載導出文件</title>
</head>
<body>
<script>
/**
* post 方式
* 返回:文件流
* 好處:可以自己修改文件名稱 方便調試
*/
let params ={
ListData : this.ListData
}
_this.$http.post(url,params,{responseType:"arraybuffer"} //必須添加項
).then(function(res) {
console.log(res)
var blob = new Blob([res.data], {type: 'application/msword;charset=utf-8'});
var filename = "download.doc";
var a = document.createElement('a');
var url = window.URL.createObjectURL(blob);
a.href = url;
a.download = filename;
var body = document.getElementsByTagName('body')[0];
body.appendChild(a);
a.click();
body.removeChild(a);
window.URL.revokeObjectURL(url);
}
/**
* get 方式
* 返回:文件流
* 好處:前臺什么都不需要處理 完全后臺處理
* 缺點:不變調試(需要確保后臺接口穩(wěn)定)
*/
let exportURL = `api/sysLog/export?content=${content}&ip=${ip}`;
window.open(exportURL, "_blank")
</script>
</body>
</html>
到此這篇關于vue中get和post請求的區(qū)別點總結的文章就介紹到這了,更多相關vue中get和post請求的區(qū)別是什么內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
Vue3使用Suspense優(yōu)雅地處理異步組件加載的示例代碼
Vue3是Vue.js的最新版本,它帶來了許多令人興奮的新特性和改進,其中一個重要的特性是Suspense,它為我們提供了一種優(yōu)雅地處理異步組件加載和錯誤處理的方式,本文給大家介紹了Vue3使用Suspense優(yōu)雅地處理異步組件加載的示例,需要的朋友可以參考下2024-01-01
vue+quasar使用遞歸實現(xiàn)動態(tài)多級菜單
這篇文章主要為大家詳細介紹了vue+quasar使用遞歸實現(xiàn)動態(tài)多級菜單,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2022-07-07

