首頁 web前端 js教程 axios發送post請求,提交圖片類型表單資料方法

axios發送post請求,提交圖片類型表單資料方法

May 29, 2018 pm 05:26 PM
axios post 提交

下面我就為大家分享一篇axios發送post請求,提交圖片類型表單資料方法,具有很好的參考價值,希望對大家有所幫助。

DOME

#
<input type="file" @change="upload" ref="upload">
登入後複製

##介面

const userUploadAtt = (File,config) => axios.post("接口",File,config)
登入後複製

處理資料

##
let input = this.$refs.upload 
创建一个空的FormData对象 
let data = new FormData();
使用FormData.append来添加键/值对到表单里面;
data.append(&#39;file&#39;, input.files[0]);
upload(){
 userUploadAtt(data,{headers: {&#39;Content-Type&#39;: &#39;multipart/form-data&#39;}}).then((response)=>{
  this.headPhoto = response.data[0].msg.url;
 }).catch(()=>{
 })
}
登入後複製

注意:如果

axios.defaults.headers.post[&#39;Content-Type&#39;] = &#39;application/x-www-form-urlencoded;charset=UTF-8&#39;
post请求时候表单上传不需要引入qs.stringify()
登入後複製

上面是我整理給大家的,希望今後對大家有幫助。

相關文章:

關於vuejs中v-if和v-show的區別及v-show不起作用問題


vue中使用iview自訂驗證關鍵字輸入框問題及解決方法


#Vue中v-show新增表達式的問題(判斷是否顯示)


#

以上是axios發送post請求,提交圖片類型表單資料方法的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

熱門話題

Java教學
1657
14
CakePHP 教程
1415
52
Laravel 教程
1309
25
PHP教程
1257
29
C# 教程
1231
24
在Vue應用程式中使用axios時出現「Uncaught (in promise) Error: Request failed with status code 500」怎麼辦? 在Vue應用程式中使用axios時出現「Uncaught (in promise) Error: Request failed with status code 500」怎麼辦? Jun 24, 2023 pm 05:33 PM

在Vue應用程式中使用axios是十分常見的,axios是一種基於Promise的HTTP客戶端,可以用於瀏覽器和Node.js。在開發過程中,有時會出現「Uncaught(inpromise)Error:Requestfailedwithstatuscode500」的錯誤提示,對於開發者來說,這個錯誤提示可能有些難以理解和解決。本文將會探討這

Vue中資料請求的選擇:Axios or Fetch? Vue中資料請求的選擇:Axios or Fetch? Jul 17, 2023 pm 06:30 PM

Vue中資料請求的選擇:AxiosorFetch?在Vue開發中,處理資料請求是一個非常常見的任務。而選擇使用哪種工具來進行資料請求,則是需要考慮的問題。在Vue中,最常見的兩種工具是Axios和Fetch。本文將會比較這兩種工具的優缺點,並給出一些範例程式碼來幫助你做出選擇。 Axios是一個基於Promise的HTTP客戶端,可以在瀏覽器和Node.

在Vue應用程式中使用axios時出現「Error: Network Error」怎麼解決? 在Vue應用程式中使用axios時出現「Error: Network Error」怎麼解決? Jun 25, 2023 am 08:27 AM

在Vue應用程式中使用axios時出現「Error:NetworkError」怎麼解決?在Vue應用程式的開發中,我們常常會使用到axios進行API的請求或資料的獲取,但是有時我們會遇到axios請求出現「Error:NetworkError」的情況,這時我們該怎麼辦呢?首先,需要了解「Error:NetworkError」是什麼意思,它通常表示網路連

在Vue應用程式中使用axios時出現「TypeError: Failed to fetch」怎麼辦? 在Vue應用程式中使用axios時出現「TypeError: Failed to fetch」怎麼辦? Jun 24, 2023 pm 11:03 PM

最近,在使用Vue應用程式開發過程中,我遇到了一個常見的問題:「TypeError:Failedtofetch」錯誤提示。這個問題出現在使用axios進行HTTP請求時,後端伺服器沒有正確回應請求時發生。這種錯誤提示通常表示請求無法到達伺服器,可能是由於網路原因或伺服器未回應造成的。出現這個錯誤提示後,我們該怎麼辦呢?以下是一些解決方法:檢查網路連接由於

高效利用Vue和Axios實現前端資料的批次處理 高效利用Vue和Axios實現前端資料的批次處理 Jul 17, 2023 pm 10:43 PM

高效利用Vue和Axios實現前端資料的批次處理在前端開發中,資料的處理是一個常見的任務。當我們需要處理大量資料時,如果沒有有效的方法,處理資料將會變得十分繁瑣和低效。 Vue是一種優秀的前端框架,而Axios是一個流行的網路請求庫,它們可以協同工作來實現前端資料的批次處理。本文將詳細介紹如何有效利用Vue和Axios來進行資料的批次處理,並提供相關的程式碼範例

在Vue應用程式中使用axios時出現「Error: timeout of xxxms exceeded」怎麼辦? 在Vue應用程式中使用axios時出現「Error: timeout of xxxms exceeded」怎麼辦? Jun 24, 2023 pm 03:27 PM

在Vue應用程式中使用axios時出現「Error:timeoutofxxxmsexceeded」怎麼辦?隨著網路的快速發展,前端技術也不斷地更新迭代,Vue作為優秀的前端框架,近年來受到大家的歡迎。在Vue應用程式中,我們常常需要使用axios來進行網路請求,但是有時候會出現「Error:timeoutofxxxmsexceeded」的錯誤

Vue和Axios實現非同步資料請求的同步化處理 Vue和Axios實現非同步資料請求的同步化處理 Jul 17, 2023 am 10:13 AM

Vue和Axios實現非同步資料請求的同步化處理引言:在現代前端開發中,由於頁面需要透過非同步資料請求來獲取資料並動態展示,因此非同步處理成為了不可避免的需求。然而,非同步資料請求往往會導致程式碼邏輯變得複雜,難以維護。在Vue框架中,搭配使用Axios函式庫可以方便地實現非同步資料請求的同步化處理,從而提高程式碼的可讀性和維護性。一、Vue簡介Vue是一款輕量級的前端框架,

在Vue應用程式中使用axios時出現「TypeError: bind is not a function」怎麼辦? 在Vue應用程式中使用axios時出現「TypeError: bind is not a function」怎麼辦? Jun 25, 2023 am 08:31 AM

在Vue.js應用程式中,使用axios是非常常見的。 Axios是一個強大的HTTP請求庫,可以讓你輕鬆發送非同步HTTP請求。然而,在使用axios時,會遇到一些錯誤,其中之一就是「TypeError:bindisnotafunction」。這個錯誤通常是由於axios版本不相容Vue.js的原因導致的。讓我們來看看這個錯誤的解決方法。首先,我們需要

See all articles