第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

文件上傳提交時為空

文件上傳提交時為空

寶慕林4294392 2023-06-29 22:44:21
我正在嘗試使用對象內(nèi)的 Axios 上傳圖像。我可以使用獲取文件new FormData()并將其放入對象中,但提交的圖像是空的。如何將對象中的文件與其他 JSON 數(shù)據(jù)結(jié)合起來上傳?import React, { useState } from 'react';import axios from 'axios';function UploadFiles() {  const [submitFile, setSubmitFile] = useState({});  const handleChange = e => {    setSubmitFile(e.target.files[0]);  };  const handleSubmit = () => {    const formData = new FormData();    formData.append('document', submitFile);    formData.append('Answer_name', 'image');    formData.append('Document', true);    formData.append('Answer', 'Got some data');    console.log(submitData) // I get formData data    const submitData = {      UUID_Formulier: '117F994F-F803-7249-91E9-EE1E7B691DFF',      answers: [formData], // this will be an empty object on calling axios.post    };    axios      .post('/submit', submitData, {        headers: {          'Content-Type': 'multipart/form-data',        },      })      .then(() => {        console.log('success');      })      .catch(() => {        console.log('failed error');      });  };  return (    <div>      <input type="file" name="image" onChange={handleChange} />      <button onClick={handleSubmit}>Submit</button>    </div>  );}圖像必須放置在答案數(shù)組中。當我將 FormData 放入答案數(shù)組時,它是一個空對象。如何將文件 formData 放入 JSON 對象或數(shù)組然后提交全部?使用方括號表示法不會創(chuàng)建數(shù)組,而是創(chuàng)建字符串,如下所示。
查看完整描述

2 回答

?
幕布斯7119047

TA貢獻1794條經(jīng)驗 獲得超8個贊

通過將文件轉(zhuǎn)換為 base64 字符串解決了這個問題。


function getBase64(file) {

  return new Promise(function(resolve, reject) {

    const reader = new FileReader();

    reader.onload = function() {

      resolve(reader.result);

    };

    reader.onerror = reject;

    reader.readAsDataURL(file);

  });

}


const [form, setForm] = useState([]);

const fileFound = e.target.type === 'file' && e.target.files[0];


const promise = fileFound && getBase64(fileFound);


promise.then(function(result) {

   setForm([

      ...form,

      {

         UUID_Answer: 'image_name,

         Answer: '',

         Document: true,

         Document_Upload: result,

      },

   ]);

});


const submitData = {

    UUID_Formulier: '117F994F-F803-7249-91E9-EE1E7B691DFF',

    answers: form,

  };


axios

  .post('/submit', submitData)

  .then(() => {

    console.log('success');

  })

  .catch(() => {

    console.log('failed error');

  });



查看完整回答
反對 回復 2023-06-29
?
斯蒂芬大帝

TA貢獻1827條經(jīng)驗 獲得超8個贊

所有數(shù)據(jù)都必須添加到 FormData 對象中,要以類似數(shù)組的形式獲取數(shù)據(jù),您可以嘗試方括號表示法。


const formData = new FormData();

formData.append('UUID_Formulier', '117F994F-F803-7249-91E9-EE1E7B691DFF');

formData.append('answers[0][document]', submitFile);

formData.append('answers[0][Answer_name]', 'image');

formData.append('answers[0][Document]', true);

formData.append('answers[0][Answer]', 'Got some data'); 


console.log(formData) // I get formData data


axios

  .post('/submit', formData, {

    headers: {

      'Content-Type': 'multipart/form-data',

    },

  })

  .then(() => {

    console.log('success');

  })

  .catch(() => {

    console.log('failed error');

  });

};


查看完整回答
反對 回復 2023-06-29
  • 2 回答
  • 0 關(guān)注
  • 239 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學習伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號