axios發(fā)送post請(qǐng)求,提交圖片類型表單數(shù)據(jù)方法
更新時(shí)間：2018年03月16日 10:30:11 作者：crli
下面小編就為大家分享一篇axios發(fā)送post請(qǐng)求,提交圖片類型表單數(shù)據(jù)方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
DOME
<input type="file" @change="upload" ref="upload">
接口
const userUploadAtt = (File,config) => axios.post("接口",File,config)
處理數(shù)據(jù)
let input = this.$refs.upload
創(chuàng)建一個(gè)空的FormData對(duì)象
let data = new FormData();
使用FormData.append來添加鍵/值對(duì)到表單里面;
data.append('file', input.files[0]);
upload(){
userUploadAtt(data,{headers: {'Content-Type': 'multipart/form-data'}}).then((response)=>{
this.headPhoto = response.data[0].msg.url;
}).catch(()=>{
})
}
注意：
如果
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8' post請(qǐng)求時(shí)候表單上傳不需要引入qs.stringify()
以上這篇axios發(fā)送post請(qǐng)求,提交圖片類型表單數(shù)據(jù)方法就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
在vue中路由使用this.$router.go(-1)返回兩次問題
這篇文章主要介紹了在vue中路由使用this.$router.go(-1)返回兩次問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-12-12
vue實(shí)現(xiàn)前端展示后端實(shí)時(shí)日志帶顏色示例詳解
這篇文章主要為大家介紹了vue實(shí)現(xiàn)前端展示后端實(shí)時(shí)日志帶顏色示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-11-11
vue項(xiàng)目回到頂部的兩種超簡(jiǎn)單實(shí)現(xiàn)方法
這篇文章主要給大家介紹了關(guān)于vue項(xiàng)目回到頂部的兩種超簡(jiǎn)單實(shí)現(xiàn)方法,?頁面切換回到頂部是一個(gè)很常見的功能,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-10-10
深入分析element ScrollBar滾動(dòng)組件源碼
這篇文章主要介紹了element ScrollBar滾動(dòng)組件源碼深入分析，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2019-01-01
父子組件之間的雙向綁定非常簡(jiǎn)單，但是很多人因?yàn)槭菑腣ue 2+開始使用的，可能不知道如何雙向綁定，接下來通過本文給大家介紹Vue父子組件雙向綁定傳值的實(shí)現(xiàn)方法,需要的朋友可以參考下2018-07-07
Vue的指令中實(shí)現(xiàn)傳遞更多參數(shù)
這篇文章主要介紹了Vue的指令中實(shí)現(xiàn)傳遞更多參數(shù)，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-05-05
babel7.x和webpack4.x配置vue項(xiàng)目的方法步驟
這篇文章主要介紹了babel7.x和webpack4.x配置vue項(xiàng)目的方法步驟,小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2019-05-05
vue-router history模式下的微信分享小結(jié)
本篇文章主要介紹了vue-router history模式下的微信分享小結(jié)，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-07-07
Vue?圖片監(jiān)聽鼠標(biāo)滑輪滾動(dòng)實(shí)現(xiàn)圖片縮小放大功能(實(shí)現(xiàn)思路)
其實(shí)想要實(shí)現(xiàn)功能很簡(jiǎn)單，就是在一張圖片上監(jiān)聽鼠標(biāo)滑輪滾動(dòng)的事件，然后根據(jù)上滾還是下滾實(shí)現(xiàn)圖片的縮放，這篇文章主要介紹了Vue?實(shí)現(xiàn)圖片監(jiān)聽鼠標(biāo)滑輪滾動(dòng)實(shí)現(xiàn)圖片縮小放大功能,需要的朋友可以參考下2023-03-03
Vue報(bào)錯(cuò)Component?name"Home"should?always?be?mult
這篇文章主要介紹了Vue報(bào)錯(cuò)Component?name"Home"should?always?be?multi問題及解決方案，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-09-09