vutoan266 / react-images-uploading

The simple images uploader applied Render Props pattern that allows you to fully control UI component and behaviors.
https://github.com/vutoan266/react-images-uploading
MIT License
320 stars 52 forks source link

Get FileList Object from ImageUploading component #61

Open RaymondMwaura opened 4 years ago

RaymondMwaura commented 4 years ago

Is it possible to get the FileList object itself from the ImageUploading component? Such as from the 'onChange' method or using a 'ref' attribute. I would like to extract the FileList object and pass it to my submit method. My efforts at building an object to mimic it and pass it on to my submit function have been unsuccessful for far. I can create an object but my backend expects a FileList and so the submission fails.

  let files;
  const onChange = (imageList) => {
    setImages(imageList);
    files = {};
    let index = 0;
    imageList.forEach((image) => {
      files[index] = image.file;
      index += 1;
    });
    // my files object above is not recognized as a FileList Object

UPDATE

Using a Map Object I was able to mimic the functionality of the FileList as follows:

  const files = [];
  const onChange = (imageList) => {
    setImages(imageList);
    imageList.forEach((image) => {
      files.push(image.file);
    });

   const FilesMap = new Map();
    let index = 0;

   files.forEach((file) => {
     FilesMap.set(file, [`variables.yourImageUrl.${index}`]);
     index += 1;
   });

However, it would be great if a callback was made available in this awesome package to simply this.