文件上傳 formdata formdata格式傳遞參數



文章插圖
文件上傳 formdata formdata格式傳遞參數

文章插圖
FormData 接口提供了一種表示表單數據的鍵值對 key/value 的構造方式,并且可以輕松的將數據通過XMLHttpRequest.send() 方法發送出去,本接口和此方法都相當簡單直接 。如果送出時的編碼類型被設為 “multipart/form-data”,它會使用和表單一樣的格式 。
創建新的對象
【文件上傳 formdata formdata格式傳遞參數】const formData = http://www.mnbkw.com/jxjc/190516/new FormData()方法
// 向 FormData 中添加新的屬性值,FormData 對應的屬性值存在也不會覆蓋原值,// 而是新增一個值,如果屬性不存在則新增一項屬性值 。FormData.append()// 從 FormData 對象里面刪除一個鍵值對 。FormData.delete()// 返回一個包含所有鍵值對的iterator對象 。FormData.entries()// 返回在 FormData 對象中與給定鍵關聯的第一個值 。FormData.get()// 返回一個包含 FormData 對象中與給定鍵關聯的所有值的數組 。FormData.getAll()// 返回一個布爾值表明 FormData 對象是否包含某些鍵 。FormData.has()// 返回一個包含所有鍵的iterator對象 。FormData.keys()// 給 FormData 設置屬性值,如果FormData 對應的屬性值存在則覆蓋原值,否則新增一項屬性值 。FormData.set()// 返回一個包含所有值的iterator對象 。FormData.values()使用
// 參數const formData = http://www.mnbkw.com/jxjc/190516/new FormData()// 獲取上傳文件const file = document.getElementById("upload-file").files[0]// 假如data是額外的其他參數for (const key in data) {if (data.hasOwnProperty(key)) {formData.append(key, data[key)}}formData.append('file', file)// 發送 POST 請求axios({method: 'post',url: '/api/upload',data: formData,headers: {"Content-Type": "multipart/form-data"}});