Question

我有大量的组件列表，并且有一个函数可以根据搜索查询从该列表中返回一个组件。

搜索功能看起来像这样：

export const components = [Comp1, Comp2, Comp3];

export type AnyComponent = Comp1 | Comp2 | Comp3... ;

export function findComponent(id: string): Type<AnyComponent>|undefined {
  return components.find(component => component.id === id);
}

有没有一种方法可以避免在类型定义和列表中两次列出我的组件？

也许是通过归约函数以联合形式返回类型列表，或者甚至没有AnyComponent而是仅使用数组？

会产生与您期望的结果类似的结果：

Type<...components>

Answer 1

您可以使用类型查询来获取components数组中项目的类型，该类型正是您想要的联合类型：

export type AnyComponent = typeof components[number]; // The class type

export type AnyComponent = InstanceType<typeof components[number]>; // or the instance type

您可以在任何地方使用InstanceType<typeof components[number]>，但我怀疑使用类型别名会更好

游乐场link

将类型设置为任何类别列表

1 个答案: