无法扩展typescript文件

Posted 2021-04-17

我正在创建一个拖放界面。在下降，我得到了原生的File。我需要扩展此接口并包含一些其他信息。

我的第一种方法是使用

interface AcceptedFile extends File {
   acl: Acl,
   disabled: boolean;
}

const toAcceptedFiles = (files: File[]): AcceptedFile[] => {
   return files.map(file => {
      return {
         ...file,
         acl: Acl.Public,
         disabled: false
      }
   });
}

但是，函数toAcceptedFiles的结果只包含来自preview的File密钥;所有的blob，名字等都消失了。如果我console.log在file内的toAcceptedFiles，我可以看到所有的钥匙。

有趣的是，以下界面工作正常：

interface AcceptedFile {
   file: File,
   acl: Acl,
   disabled: boolean;
}

为什么扩大File打破它？

答案

为什么第一种方法不起作用spread operator issues with property accessors (getters)

你的第二种方法更合理，因为原生api会给你一个File[]，你要映射到你的类型AcceptedFile。

const toAcceptedFiles = (files: File[]): AcceptedFile[] => {
   return files.map(file => {
      return {
         file: file,
         acl: Acl.Public,
         disabled: false
      }
   });
}

当从本机API调用toAcceptedFiles时，它将填充File[]而不是AcceptedFile[]。

interface AcceptedFile {
   file: File;
   acl: Acl,
   disabled: boolean;
}