访问从 GraphQL 生成的多个嵌套 TypeScript 类型

Posted 2023-03-08

【中文标题】访问从 GraphQL 生成的多个嵌套 TypeScript 类型

【英文标题】：Access multiple nested TypeScript type generated from GraphQL

【发布时间】：2021-08-22 13:54:42

【问题描述】：

我只需要访问从 GraphQL 生成的这个大类型中的“部门”类型：

export type GetCompanyChartQuery = (
   __typename?: 'Query' 
  &  generateOrgChart?: Maybe<(
     __typename?: 'DepartmentNode' 
    & Pick<DepartmentNode, 'name'>
    &  manager?: Maybe<(
       __typename?: 'EmployeeNode' 
      & Pick<EmployeeNode, 'name' | 'mobilePhone'>
    )>, departments?: Maybe<Array<Maybe<(
       __typename?: 'DepartmentNode' 
      & Pick<DepartmentNode, 'name' | 'depth'>
      &  manager?: Maybe<(
         __typename?: 'EmployeeNode' 
        & Pick<EmployeeNode, 'name'>
      )>, employees?: Maybe<Array<Maybe<(
         __typename?: 'EmployeeNode' 
        & Pick<EmployeeNode, 'imageUrl' | 'mobilePhone' | 'name' | 'position' | 'title' | 'depth'>
      )>>>, departments?: Maybe<Array<Maybe<(
         __typename?: 'DepartmentNode' 
        & Pick<DepartmentNode, 'name' | 'depth'>
        &  manager?: Maybe<(
           __typename?: 'EmployeeNode' 
          & Pick<EmployeeNode, 'name'>
        )>, employees?: Maybe<Array<Maybe<(
           __typename?: 'EmployeeNode' 
          & Pick<EmployeeNode, 'imageUrl' | 'mobilePhone' | 'name' | 'position' | 'title' | 'depth'>
        )>>> 
      )>>> 
    )>>> 
  )> 
);

我找不到解决方法。 Pick 或 GetCompanyChartQuery['subtype'] 在这里不起作用。

我正在尝试使用 GraphQL 查询获取数据并将响应置于如下状态：

const [departments, setDepartments] = useState<TheTypeINeedToAccess>();

setDepartments(data?.generateOrgChart?.departments);

但要做到这一点，我需要正确的类型。

提前致谢。

【参考方案1】：

我认为选择子类型的问题在于可选属性。如果你使对象不为空，TypeScript 可以挑选出子类型。

type Departments = Required<GetCompanyChartQuery>["generateOrgChart"]["departments"]