Question

我虽然这很简单，但显然我错了。如何基于枚举键创建简单的条件类型？像这样：

export enum inputTypes {
  text = 'text',
  email = 'email',
  password = 'password',
  number = 'number',
  date = 'date',
  textarea = 'textarea',
  dropdown = 'dropdown',
  checkbox = 'checkbox',
}

export interface IInput {
  id: string,
  type: inputTypes,
  name: string,
}

以及基于 inputType 的条件类型：

export type onInputChange =
IInput['type'] extends inputTypes.dropdown
? DropDownChangeEventHandler
: FormChangeEventHandler;

我尝试了 keyof typeof keyof typeof 的一些变体，但无法达到我想要的效果。

我需要的最终结果是，如果输入类型是下拉列表，我希望有一个不同的更改事件。所以我的 type onInputChange 将等于：DropDownChangeEventHandler | FormChangeEventHandler，然后在代码中执行类型保护并获取下拉更改事件的正确类型。

Answer 1

我不确定我是否正确理解了您要执行的操作，但我认为问题可能与您在 onInputChange 类型上的情况有关：

export type onInputChange =
   IInput['type'] extends inputTypes.dropdown
   ? DropDownChangeEventHandler
   : FormChangeEventHandler;

你在这里说的是：如果 type 接口上的属性 IInput 的类型扩展 'dropdown' 给我类型 DropDownChangeEventHandler 否则给我类型 {{1} }.

关键是条件永远不会成立，因为您将 FormChangeEventHandler 上的 type 定义为 IInput。枚举类型定义了每个枚举成员的联合，inputTypes 将始终为 false。

我想，您实际想要检查的条件不是 'foo' | 'bar' extends 'foo' 接口上的 type 属性类型，而是特定接口上 IInput 属性的类型 该接口的实现。显然，只有在您实现了接口后，这些信息才可用。

一种方法可能是使用泛型：

type

枚举键上的打字稿条件类型

1 个答案: