映射类型不能在 TS 中声明属性或方法

作者

映射类型不能在 TS 中声明属性或方法

A mapped type may not declare properties or methods in TS

当我们在使用映射类型时尝试使用接口而不是类型别名时，会出现错误“映射类型不能声明属性或方法”。

要解决该错误，请仅使用具有映射类型的类型别名。

下面是错误如何发生的示例。

索引.ts
enum EmailStatus {
  Read = 'READ',
  Unread = 'UNREAD',
  Draft = 'DRAFT',
}

interface Status  {
  // ⛔️ Error: A mapped type may not declare properties or methods.ts(7061)
  [key in EmailStatus]: string;
}

代码示例的问题是我们应该使用
类型别名，而不是
在使用
映射类型时使用接口。

索引.ts
enum EmailStatus {
  Read = 'READ',
  Unread = 'UNREAD',
  Draft = 'DRAFT',
}

// 👇️ use type alias
type Status = {
  [key in EmailStatus]: string;
};

映射类型使我们能够从类型的属性构造类型并将它们指向不同类型的值。

下面是一个示例，它从一个具有更具体的字符串文字值的类型创建一个具有字符串值的类型。

索引.ts
type Person = {
  name: 'Bobby Hadz';
  country: 'Germany';
};

// 👇️ use type alias
type UpdatedPerson = {
  [key in keyof Person]: string;
};

仅对映射类型使用类型别名

请注意，您只能对映射类型使用类型别名，否则会抛出错误。

当您想从联合的成员构造新类型时，也可以使用相同的方法。

索引.ts
type EmailStatuses = 'Read' | 'Unread' | 'Draft';

// 👇️ make sure you use type here (not interface)
type StatusFromUnion = {
  [key in EmailStatuses]: string;
};

该类型表示一个对象，其中属性是联合的成员
，值是类型
string。

额外资源

您可以通过查看以下教程来了解有关相关主题的更多信息：