TypeScript泛型接口导致导航参数类型校验失效问题求助

你当前的代码存在两个核心问题：

1. DefaultParams接口里的screen和params没有绑定关系——screen可以是目标栈的任意键，但params可以是该栈里任意键对应的参数类型，两者不需要匹配，比如传screen: 'Dashboard'时，params可以传undefined（对应Activity的参数），这不符合预期。
2. 虽然RootTabParamList给Home和Health分别绑定了不同的栈参数列表，但由于DefaultParams的设计缺陷，还是可能出现跨栈参数混用的情况。

用联合类型实现严格的参数绑定 #

我们可以定义一个ScreenParams类型，自动把栈参数列表转换成每个屏幕与对应参数严格绑定的联合类型，这样既能保证screen和params一一对应，又能防止跨栈参数混用。

1. 定义ScreenParams类型

type ScreenParams<T> = {
  [K in keyof T]: {
    screen: K;
    params?: T[K];
  };
}[keyof T];

这个类型会遍历目标栈的所有屏幕键，为每个屏幕生成一个专属的参数对象类型，最后把这些类型合并成联合类型。每个联合成员里的screen和params是强绑定的，不会出现不匹配的情况。

2. 修改RootTabParamList的定义

把原来的DefaultParams替换成ScreenParams：

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

效果验证

现在导航时的类型校验会严格生效：

• 合法示例：navigate('Home', { screen: 'Dashboard', params: { tab: 'feed' } })、navigate('Home', { screen: 'Activity' })
• 错误示例（会触发类型报错）：
  • navigate('Home', { screen: 'Dashboard', params: undefined })（Dashboard要求必须传tab参数）
  • navigate('Home', { screen: 'SystemDetailsScreen', params: { tenetCode: TenetCodes.Energy } })（SystemDetailsScreen不属于Home栈）
  • navigate('Health', { screen: 'Dashboard' })（Dashboard不属于Health栈）

如果一定要保留类似DefaultParams的接口形式，也可以改成绑定具体屏幕键的泛型版本：

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

不过这个版本使用时需要显式指定屏幕键，不如联合类型的方式灵活方便。

内容的提问来源于stack exchange，提问作者nodir.dev