TypeError: Network request failed. How to Append Multiple Images in Array to formData properly. react native

Question

I am new to react native. I am trying to append multiple images in array to formData. like this

 formData.append('application_copy_file', 
          [{
            uri: this.state.ApplicationCopy,
            name: 'upload_application_copy.jpg',
            type: 'image/*'
          },
          {
            uri: this.state.ApplicationCopy1,
            name: 'upload_application_copy1.jpg',
            type: 'image/*'
          },
          {
            uri: this.state.ApplicationCopy2,
            name: 'upload_application_copy2.jpg',
            type: 'image/*'
          },
        ]);

But when I append like this. I am getting error like this when I submit form = [TypeError: Network request failed]

And when I upload only one like this =

formData.append('application_copy_file', 
           {
            uri: this.state.ApplicationCopy,
            name: 'upload_application_copy.jpg',
            type: 'image/*'
          }
          );

then its working fine but saying = count(): Parameter must be an array or an object that implements Countable. from server response.text. please help.

Answer 1

try like this

formData.append('application_copy_file[0]', 
       {
        uri: this.state.ApplicationCopy,
        name: 'upload_application_copy.jpg',
        type: 'image/*'
      }
      );
formData.append('application_copy_file[1]', 
       {
        uri: this.state.ApplicationCopy1,
        name: 'upload_application_copy.jpg',
        type: 'image/*'
      }
      );

if i assume everyhing in your state is just for uploading.

you can do,

Object.keys(this.state).forEach((item, i) => {
      formData.append(`application_copy_file[${i}]`, 
       {
        uri: this.state[item],
        name: this.state[item] + '.jpg',
        type: 'image/*'
      }
      );
})

Answer 2

You will have to pass the images array so put the array in JSON.stringify(your images array)