异步功能：for循环对象在await语句后为空

Question

底部的

tldr：

我真的不知道如何解释我的问题，所以我从一个例子开始。 我有这个异步功能（在reactJS中，但我认为这是与JS相关的问题）。

 onUploadDrop = async (e, folderId) => {
        e.preventDefault();
        // check if the user uploaded files or folders
        var uploadedItems = e.dataTransfer.items;
        let files = [];
        for (var i = 0; i < uploadedItems.length; i++) {
            let item = uploadedItems[i].webkitGetAsEntry();
            if (item.isDirectory) {
                alert("is directory")
            } else {
                var file = await this.getFileByWebkitEntry(item);
                files.push(file);
            }
            console.log(i);
        }

     // do something with files[]
    }

此函数正在调用另一个异步函数：

getFileByWebkitEntry = async (item) => {
    return new Promise(resolve => {
        item.file(function (file) {
            resolve(file);
        }, function (err) {
            console.log(err);
            resolve("");
        });
    });
}

我正在遍历e.datatransfer.files，它们基本上是一些上载的文件或文件夹。不幸的是，此for循环仅执行一次。

我进行了一些调试，发现如果在此行之前和之后放置console.log：var file = await ...会出现：

tldr：在await语句中uploadItems为空后，结束循环。为什么会这样？

Answer 1

我通过不使用异步来解决此问题-等待而是改为Promises。 看起来像这样：

<BrowserRouter>
  <Route path="/login" exact component={FormularAuth} />
  <PrivateRoute path='/private' component={Private} />
</BrowserRouter>