不能与文件列表一起使用forEach

2020/11/17 17:21 · javascript ·  · 0评论

我正在尝试通过Filelist

console.log('field:', field.photo.files)
field.photo.files.forEach(file => {
   // looping code
})

如您所见field.photo.files有一个Filelist

在此处输入图片说明

如何正确循环field.photo.files

AFileList不是Array,但确实符合其合同(具有length数字索引),因此我们可以“借用”Array方法:

Array.prototype.forEach.call(field.photo.files, function(file) { ... });

由于您显然正在使用ES6,因此还可以Array使用新Array.from方法将其设置为适当的

Array.from(field.photo.files).forEach(file => { ... });

您也可以使用以下简单方法进行迭代:

var files = field.photo.files;

for (var i = 0; i < files.length; i++) {
    console.log(files[i]);
}

在ES6中,您可以使用:

[...field.photo.files].forEach(file => console.log(file));

参考:https : //developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment

lodash库有_forEach方法,通过收集所有实体,如数组和对象,其中包括文件清单循环:

_.forEach(field.photo.files,(file => {
     // looping code
})

以下代码在Typescript中

     urls = new Array<string>();

     detectFiles(event) {
       const $image: any = document.querySelector('#file');
       Array.from($image.files).forEach((file: any) => {
       let reader = new FileReader();
       reader.onload = (e: any) => { this.urls.push(e.target.result); }
       reader.readAsDataURL(file);
      }
    }

如果您使用的是Typescript,则可以执行以下操作:对于FileList []或File []类型的变量'files',请使用:

for(let file of files){
    console.log('line50 file', file);
  }
本文地址:http://javascript.askforanswer.com/bunengyuwenjianliebiaoyiqishiyongforeach.html
文章标签: ,  
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!