当我console.log它时，formData是空的

Question

我想在表单中上传图像，但一段时间后我知道在 multipart/form-data 中我需要使用 formData。在我的代码中使用 formData 后，我发现空值被发送到数据库中。然后我尝试将 console.log 写入 formData，但它是空的。我现在不知道该怎么办。

注意：我在后端使用了multer来处理图片上传，所以后端没有任何问题。

这是我的提交句柄

const handlesubmit = async (e) => {
    e.preventDefault();
    try {
      setshowloader(true);

      
      const data = {
        en_name: engName,
        hi_name: hiName,
        employeeID: EID,
        AadharNo: aadharNo,
        ContactNo: contactNo,
        employeeStatus: empStatus,
        address: address,
        city: city,
        state: state,
        designation: designation,
        employeeSalary: salary,
        Email: email,
        department: dept,
        joiningDate: joinDate,
        employeeType: emplType,
        BankName: bankName,
        BankBranch: bankBranch,
        IFSC_Code: bankIfsc,
        AccountNo: accNumber,
        AccountHolderName: accHolderName,
        employeePhoto: empPhoto,
    };
    
    const formData = new FormData();

    
    for (const key in data) {
      console.log(`Key: ${key}, Value: ${data[key]}`);
      formData.append(key, data[key]);
    }
    

      console.log(formData)

      serverInstance('hr/add-employee', 'post', formData).then((res) => {
        if (res?.status) {
          console.log(res.msg);
          setOpen(false);
          setshowloader(false);
          Swal.fire('Great!', res?.msg, 'success');
          handleClose();
        }
        if (res?.status === false) {
          console.log(res.message);
          setOpen(false);
          setshowloader(false);
          Swal.fire('Error', res?.msg, 'error');
        }
      });
    } catch (error) {
      console.log('catch' + error)
      Swal.fire('Error!', error, 'error');
    }
  };

这是我的服务器实例

import { backendApiUrl } from '../config/config';

export const serverInstance = (path, method = 'get', payload, token) => {
  let headers = {
    'Content-Type': 'application/json', 
   
    Authorization: `Bearer ${sessionStorage.getItem('token')}`,
  };
  return new Promise((resolve, reject) => {
    let fetchOptions = {
      method,
      headers,
    };
    if (payload) fetchOptions.body = JSON.stringify(payload);
    fetch(backendApiUrl + path, fetchOptions)
      .then((res) => resolve(res.json()))
      .catch((err) => reject(err));
  });
};

表单数据没有附加？或者我还需要做其他事情吗？

Answer 1

尝试

formData.entries()

我想这已经在这里得到了解答。