Save many file in FileList[0]-CodePudding

I have 2 input upload file and same function and file save in array from push

  manyImage = []
  selectImage(event) {
    if (event.target.files.length > 0) {
      this.manyImage.push(event.target.files)
    }
    console.log(this.manyImage)
  }

when i use console.log(this.manyImage)

output:

(2) [FileList, FileList]
0: FileList {0: File, length: 1}
1: FileList {0: File, length: 1}
length: 2

what i need :

when i uploaded 2 times different input file but same function the output will be like this

what i want output:

0: FileList {0: File, 1: File, length: 2}
length: 1

i want save all file in one array and in index of FileList[0] please help

CodePudding user response：

Try creating an array from the FileList and concating the first FileList array with the next one.

I am not sure if your mayImage array will only have zero or one items. In case it will then you could try this snippet:

if (this.manyImage.length == 0) {
   this.manyImage.push(
      Array.from(event.target.files)
    );
} else {
   this.manyImage[0] = this.manyImage[0].concat(
       Array.from(event.target.files)
   );

If your manyImage array will contain more than one item then you need to specify which item to merge the two FileList in and then you can adjust the code snippet.

CodePudding user response：

You can use ES6 destructing:

selectImage(event) {
   if (event.target.files.length > 0) {
      this.manyImage.push(...event.target.files);
   }
   console.log(this.manyImage)
}