通用、联合和扩展。打字稿答案

【问题标题】：Generic, Union and extending. Typescript通用、联合和扩展。打字稿
【发布时间】：2021-07-03 00:01:26
【问题描述】：

我有一堂课RawTemplate

export type TestUnion = 'test1' | 'test2';
export class RawTemplate {
  someProperty: Record<TestUnion, Record<string, string>>;
}

然后我创建了扩展 RawTemplate 的新类 Raw

export class Raw extends RawTemplate {
  someProperty: {
    test1: { name1: 'name'; name2: 'name' };
    test2: { name3: 'name' };
  };
}

然后我创建一个泛型类型Generic 和一个类型Target

export type Key<T extends RawTemplate> = keyof T['someProperty'][TestUnion];

export type Generic<T extends RawTemplate> = Record<Key<T>, string>;

export type Target = Generic<Raw>;

我想得到 Target 这样的类型：{ name1: string; name2: string; name3: string } 但我得到了关注类型：{}

如果我这样重写我的类型：

export type Key<T extends RawTemplate> = keyof T['someProperty']['test1'];

export type Generic<T extends RawTemplate> = Record<Key<T>, string>;

export type Target = Generic<Raw>;

我得到了关注Target 类型：{ name1: string; name2: string } 几乎如我所愿。

或者我可以这样重写我的类型：

export type Key<T extends RawTemplate> = keyof T['someProperty']['test1' | 'test2'];

export type Generic<T extends RawTemplate> = Record<Key<T>, string>;

export type Target = Generic<Raw>;

但我得到了关注 Target 再次输入：{}

我发现的唯一可行的案例：

export type Key1<T extends RawTemplate> = keyof T['someProperty']['test1'];

export type Key2<T extends RawTemplate> = keyof T['someProperty']['test2'];

export type Generic<T extends RawTemplate> = Record<Key1<T>, string> | Record<Key2<T>, string>;

export type Target = Generic<Raw>;

如何正确写入类型？我将扩展TestUnion 类型，我不想每次都重写我的Generic 类型。

【问题讨论】：

“高级”打字不是一件好事

标签： typescript typescript-typings typescript-generics

【解决方案1】：

您无法使用元组 (|) 获取对象的属性类型。

// type Target = never
type Target = keyof Raw['someProperty']['test1' | 'test2']

您将不得不对键进行元组处理。

export type Generic<T extends RawTemplate> = Record<Key<T, 'test1'> | Key<T, 'test2'>, string>;

// type Target = {
//     name1: string;
//     name2: string;
//     name3: string;
// }
export type Target = Generic<Raw>;

或者，加入对象并在其上使用keyof。

// type Target = {
//     name1: string;
//     name2: string;
//     name3: string;
// }
export type Target = { [key in keyof (Raw['someProperty']['test1'] & Raw['someProperty']['test2'])]: string };

【讨论】：