通过拖放上传时如何遍历文件夹中的每个文件

Question

我正在尝试通过React应用程序中的拖放操作上传文件

开票事件

onDrop(event) {
   event.preventDefault();
   event.stopPropagation();
   if (this.props.disabled) return;

   const items = event.dataTransfer.items; 
   /* ONLY RETURNS Array(1) i.e just the name of the directory, does not return the files inside */

   if (this.props.onFilesAdded) {
        //how to traverse items here
   }
   this.setState({ hightlight: false });
}

输入标签

<input
    ref={this.fileInputRef}
    className="FileInput"
    type="file"
    directory="true"
    webkitdirectory="true"
    mozdirectory="true"
    onChange={this.onFilesAdded}
/>

const length = event.dataTransfer.files.length;
console.log(length);
if (this.props.onFilesAdded) {
   for (var i = 0; i < length; i++) {
   var file = event.dataTransfer.files[i];
}

此控制台记录了1个不正确的

尝试过此处给出的内容：https://wiki.whatwg.org/wiki/DragAndDropEntries

这里的问题是，当我单击并上传时，文件夹上传可以正常工作，但是当我将文件夹拖放到我的拖放区时，它无法将所有文件都放到里面，只是返回了我拖动的文件夹的名称。