3

graphql-codegen用来从我的 graphQL 查询中生成类型。

结果有时非常复杂,特别unions是在涉及时。

这是一个具体的例子

export type GroupQuery = { __typename?: 'Query' } & {
  group?: Maybe<
    { __typename?: 'Group' } & Pick<
      Group,
      'id' | 'name' 
    > & {
        criterions: Array<
          { __typename?: 'kindA' } & Pick<SomeModel, 'id' | 'type'> | 
          { __typename?: 'kindB' } & Pick<SomeOtherModel, 'id' | 'type' | 'count'>
        >
    }
  }

所以我想做的是能够参考工会的具体案例__typename

let kindB: NonNullable<GroupQuery['group']>['criterions'][0]// not sure where to go from here.

也许是实用程序类型?

4

1 回答 1

2

这个类型:

type T = NonNullable<GroupQuery['group']>['criterions'][0]`

将被解析为这种类型:

type T = {
    __typename?: "kindA" | undefined;
    id: number;
    name: string;
} | {
    __typename?: "kindB" | undefined;
    id: number;
    name: string;
}

所以你真正要问的是如何让工会的分支在哪里:

__typename === 'kindB'

在这种情况下,您可以使用交集&来过滤联合类型。一般来说,它是这样工作的:

type T = ("A" | "B" | "C") & "A" // "A"

操场

因此,您可以使用交集使联合仅解析为可以匹配相交类型的类型。

type KindB =
    NonNullable<GroupQuery['group']>['criterions'][0] & { __typename: 'kindB' }

现在KindB解析为这种类型:

type KindB = {
    __typename?: "kindB" | undefined;
    id: number;
    name: string;
} & {
    __typename: 'kindB';
}

如您所见,kindA工会的成员不再存在,而工会的其余成员正在与 相交{ __typename: 'kindB' }。如果您应用该交集,它会减少为:

type KindB = {
    __typename: "kindB";
    id: number;
    name: string;
}

有工作代码的游乐场


通过一些重构,你甚至可以使用一个不错的泛型类型别名来使它变得非常好:

// Union of all criterion types
type GroupQueryCriterions =
    NonNullable<GroupQuery['group']>['criterions'][number]

// Get the branch of the criterions union that has a specific typename.
type GroupQueryCriterionType<T extends GroupQueryCriterions['__typename']> =
    GroupQueryCriterions & { __typename: T }

// Get a specific criterion type.
type KindB = GroupQueryCriterionType<'kindB'>

操场

于 2020-06-12T17:59:47.520 回答