vue中get和post請求的區(qū)別點總結

更新時間：2021年12月22日 08:31:15 作者：青燈夜游

在本篇文章里小編給大家分享的是一篇關于vue中get和post請求的區(qū)別點總結內(nèi)容，對此有興趣的朋友們可以跟著學習下。

本教程操作環(huán)境：windows7系統(tǒng)、vue2.9.6版，DELL G3電腦。

vue中get和post請求的區(qū)別

1、get請求

在GET請求中參數(shù)是跟在URL后面，即參數(shù)放在header中。能傳的參數(shù)較小。使用params。

this.$http.get(' URL ').then(result=>{
if(result.status===0){
// 成功了
this.list=result.message;
// 這里是假設被請求的數(shù)據(jù)表中的列表名稱為message
}else{
// 失敗了 ，彈出窗體警告
alert("數(shù)據(jù)請求失敗");
}
})

2、post請求

在POST請求中參數(shù)是放在body中，并不跟在URL后面。使用data,傳遞的參數(shù)較大。

this.$http.post('URL',{id:this.id},{emulateJSON:true})..then(result=>{
if(result.body.status===0){
// 成功了
}else{
// 失敗了
alert("獲取數(shù)據(jù)失敗！");
]
})

知識點擴展：

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ū)別是什么內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: