如何在TypeScript中混合固定属性与带前缀的动态属性？

一、普通动态属性+固定属性的实现 #

你原来的写法存在两个问题：一是索引签名语法不合法，必须明确指定键的类型（比如[key: string]）；二是固定属性类型需要和索引签名类型兼容，或者通过交叉类型处理类型不一致的场景。

1. 固定属性与动态属性类型一致时
   直接在类型中同时声明固定属性和合法的索引签名即可：

type FormValues = {
  hardcodedKey: string;
  [key: string]: string; // 类型与固定属性保持一致
};

2. 固定属性与动态属性类型不同时
   用交叉类型结合Record实现，同时通过Exclude排除固定属性的键，避免类型推断冲突：

type FormValues = {
  hardcodedKey: string;
} & Record<Exclude<string, "hardcodedKey">, string[]>;

这样TypeScript能准确识别：hardcodedKey的类型是string，其他所有字符串类型的键对应值的类型是string[]。

二、带前缀的动态属性+固定属性的实现 #

TypeScript 4.4及以上版本支持模板字面量类型作为索引签名，可以直接定义带特定前缀的动态属性：

type FormValues = {
  hardcodedKey: string;
  [key: `gr-${string}`]: string[];
};

这个类型会匹配所有以gr-开头的键，其值类型为string[]，同时保留固定属性hardcodedKey。

内容的提问来源于stack exchange，提问作者Jack Pilowsky