Attachment with multiple files using the Javascript API

1

Hi, I have done single file upload using Javascript API with help of this https://community.developer.atlassian.com/t/attaching-a-file-to-a-page-using-the-javascript-api/39682

 onChangeAttachmentFiles = (event) => {
    this.setState({ attachmentFiles: event.target.files[0] });
  }
 submitAttachmentFiles = (issueRes) => {
    const selectedFiles = this.state.attachmentFiles;
    const fileToUpload = new File([selectedFiles], selectedFiles.name, {
      type: selectedFiles.type,
    });

    const payload = {
      file: fileToUpload,
      comment: 'test attachment',
      minorEdit: 'true',
    };

    AP.request({
      type: 'POST',
      url: `/rest/api/3/issue/${issueRes.key}/attachments`,
      contentType: 'multipart/form-data',
      headers: {
        'X-Atlassian-Token': 'nocheck',
      },
      data: payload,
    })
     .then(() => {})
     .catch((err) => {});
  }

I need to do for multiple files upload, I have tried like below code but its not working

 <input id="file-upload"  type="file" multiple name="file"   />

 submitAttachmentFiles = (issueRes) => {
   const file = document.getElementById('file-upload');
   const fileToUpload = [];
   for (let i = 0; i < file.files.length; i += 1) {
      const newObj = {};
      newObj.file = new File([file.files[i]], file.files[i].name, {
        type: file.files[i].type,
      });
      newObj.comment = 'test attachment';
      newObj.minorEdit = 'true';
      fileToUpload.push(newObj);
    }
    const finalData = { ...fileToUpload };

    AP.request({
      type: 'POST',
      url: `/rest/api/3/issue/${issueRes.key}/attachments`,
      contentType: 'multipart/form-data',
      headers: {
        'X-Atlassian-Token': 'nocheck',
      },
      data: finalData,
    })
     .then(() => {})
     .catch((err) => {});
}

any suggestions please to solve this