JavaScript中File对象复制及重命名重复文件的大小问题

嘿，这个问题其实很好解决！首先得搞清楚File构造函数的第一个参数是什么——它接受一个BlobPart类型的数组，而File本身是Blob的子类，所以你直接把原文件对象放到这个数组里，就能完整复用原文件的内容和大小啦。

你原来代码里的XXX位置，直接替换成[lastFile]就可以了。这样新创建的File对象会和原文件拥有完全相同的内容、大小，同时你可以自定义它的名称和其他属性。

完整的代码示例如下：

// 假设lastFile是检测到的同名原文件
// 优化文件名处理：分割名称和后缀，避免破坏带多个点的文件名
const [nameWithoutExt, ext] = lastFile.name.split(/(?=\.)/); 
const newName = `${nameWithoutExt}(1)${ext || ''}`;

// 创建新的File对象
const newFile = new File(
  [lastFile], // 这里就是你要的XXX，传入原File对象复用内容和大小
  newName,
  {
    type: lastFile.type,
    lastModified: lastFile.lastModified,
    preview: lastFile.preview, // 保留react-dropzone的预览属性
    webkitRelativePath: lastFile.webkitRelativePath
  }
);

补充说明： #

1. 文件名分割优化：用正则分割文件名和后缀，哪怕文件名里有多个点（比如my.report.v2.pdf），也能正确在名称部分添加(1)后缀，不会破坏扩展名。
2. File构造函数逻辑：新File的大小是由传入的内容决定的，不需要手动设置——你传入原File作为内容，自然就继承了它的大小，完全不用额外处理。
3. react-dropzone属性保留：dropzone给File对象添加的preview等自定义属性，我们手动传递进去就能保留，不会影响后续的预览展示。

如果之后需要处理多次同名的情况（比如已经存在Dog(1).docx，要生成Dog(2).docx），可以再写个小函数检测已有的文件名，自动递增数字后缀，不过这就是额外的扩展啦。

内容的提问来源于stack exchange，提问作者Ernesto