有没有办法用动态字段名称构建类型接口?

时间:2021-02-08 12:54:03

标签: typescript typescript-generics react-typescript

我想围绕以下行构建一个类型:

int

因为 API 端点有这种奇怪的设计。

我曾尝试做这样的事情:

long

其中可以订阅如下对象:

interface Type<ofWhat>'fieldName'{
    fieldName: ofWhat[];
    otherProps: any;
}

然而,这对于不理解 type Page<T> = {pageInfo: PageInfo} | {[key:string]: Array<T>} 是动态名称并标记为错误的 linter 来说是有问题的。

有什么改进这个界面设计的想法吗? 谢谢!

1 个答案:

答案 0 :(得分:1)

Record<> 与键 seems to check out... 的受限类型一起使用

type BasePage = { pageInfo: PageInfo };
type Page<Key extends string, Type> = BasePage & Record<Key, Type[]>;

interface Card {
  header: string;
  title: string;
  content: string;
  lawsuitId: string;
}

interface PageInfo {
  totalItens: number;
  totalPages: number;
  pageNumber: number;
  lastPage: boolean;
}

type CardPage = Page<"cards", Card>;

const obj2: CardPage = {
  pageInfo: {
    totalItens: 0,
    totalPages: 0,
    pageNumber: 0,
    lastPage: true,
  },
  cards: [
    {
      header: "string",
      title: "string",
      content: "string",
      lawsuitId: "3fa85f64-5717-4562-b3fc-2c963f66afa6",
    },
  ],
};