forEach适用于CRA/Next JS应用程序的FileList，但不适用于使用create-next-app创建的

Question

我很困惑。当我在使用CRA创建并迁移到Next JS(只是相同的文件)的网站上的FileList上使用forEach时，forEach工作。但是，当我使用create-next-app重新创建我的网站时，现在我不能在fileList上使用forEach。我刚刚测试了我的两个文件，我运行了我的CRA/Nextjs网站，forEach仍然在FileList上工作，但我的create-next-app网站在forEach上出现了错误。

这是我的代码示例:

const selectImageHandle = (e) => {
let arrayImages = [];
e.target.files.forEach(file => {
arrayImages.push(file);
})
}

当我使用create-next-app重新创建我的网站时，我没有注意到这一点，因为它已经在我的CRA/Next Js上工作了。谢谢你！

编辑:我在我的create-next-app上得到的错误是

e.target.files.forEach is not a function

Answer 1

你的文件输入只是一个普通的html输入，还是一个来自库的组件?

似乎你以前得到一个事件，其中e.target.files是一个数组，现在你得到一个，其中它是一个实际的FileList，它没有forEach方法。

FileList是可迭代的，但是，正如我在上面的评论中提到的，你可以这样做(这有一个简洁的优点):

const arrayImages = […e.target.files];

如果没有额外的信息，我不确定为什么create-react-app与create-next-app之间会有不同。如果你使用的是标准的html输入，我不会期望有任何差异，但如果你使用的是现成的组件或拖放目标，那么你可能会选择该组件的不同版本，在这方面的行为略有不同。