Form data is always empty no matter what we appended to it

Question

I'm trying to build a form data to send files alongside data to the back-end so I have all my values stored in something like this

const [values, setValues] = useState ({
  name: '',
  profileImg: '',
  gallery: [] `it's an array of imgs`
}); 

and here is my attempts to convert this into formData

const tempPayload = new FormData();
tempPayload.append('name', values.name);
tempPayload.append('profileImg', values.profileImg)
for(let i = 0; i < gallery.length; i++){
tempPayload.append('gallery', gallery[i]
}

and when I try to console.log(tempPayload) it's always empty?! I expect it to have the data that I passed to it

Answer 1

You have to re assign the formData variable like this:

tempPayload = tempPayload.append('name', values.name);