如何在反应中将自定义属性插入文件对象

问题描述

我正在研究文件上传功能，当我选择多个文件或单个文件时我想实现什么我想为每个 File 对象分配自定义属性自定义属性必须像 percentage:0 到 File目的。我努力尝试，但没有找到任何合适的解决方案来解决这个问题。有人可以帮我解决这个问题吗。

谢谢

代码

  addManualAttachments = (event) => {
    let files = event.target.files

    const fileList = Array.from(files)

    if (fileList.length > 10) {
      Swal.fire('Warning !','Maximum files upload limit is 10','warning')
      return false
    }

    for (let i = 0; i < fileList.length; i++) {
      if (this.validateFile(fileList[i])) {
        this.setState((prevstate) => {
          return {
            ...prevstate,selectedFiles: this.uniqueFiles([...prevstate.selectedFiles,fileList[i]]),}
        })
      }
    }
  }

解决方法

如果它是一个普通的 Javascript 对象，您可以在循环时将新属性添加到文件中。此外，您可以使用 forEach 循环而不需要 for 循环：

addManualAttachments = (event) => {
  const files = Array.from(event.target.files);

  if (files.length > 10) {
    Swal.fire('Warning !','Maximum files upload limit is 10','warning')
    return false
  }

  files.forEach((file) => {
    if(this.validateFile(file)) {
      file.percentage = 0; // <-- This will add the new property to the object reference stored for that file object.
      this.setState((prevState) => {
        return {
          ...prevState,selectedFiles: this.uniqueFiles([...prevState.selectedFiles,file]),}
      });
    }
  });
}