TypeScript 动态挑选接口的匹配键值对

Question

我正在使用以下通用接口来选择接口的匹配键值对类型：

interface DefaultParams<T> {
  screen: keyof T;
  params?: T[keyof T];
}

我想将它与此导航类型一起使用，以便我可以在导航函数中传递分别匹配的值：

export type RootTabParamList = {
  Home: undefined | DefaultParams<HomeTabStackParamList>;
  Health: undefined | DefaultParams<HealthTabStackParamList>;
};

export type HealthTabStackParamList = {
  HealthScreen: undefined;
  SystemsList: undefined;
  SystemDetailsScreen: {
    tenetCode: TenetCodes;
    tenetResult?: string;
  };
  SampleSummaryScreen: {
    range?: Range;
    tenetCode: TenetCodes;
    sampleCode: string;
  };
};

但它允许我在

HomeTabStackParamList

和

HealthTabStackParamList

键之间互换使用

Home

和

Health

Answer 1

如果您想根据

RootTabParamList

中对应的按键对屏幕和参数键进行严格的类型检查，可以通过在

DefaultParams

界面中进行如下修改来实现：

type ScreenParams<T> = T extends { [key: string]: any }
  ? DefaultParams<{ screen: keyof T; params?: T[keyof T] }>
  : never;

export type RootTabParamList = {
  Home: undefined | ScreenParams<HomeTabStackParamList>;
  Health: undefined | ScreenParams<HealthTabStackParamList>;
};