TypeScript如何定义支持泛型指定动态属性名的接口

AI 小北

2026-9-2

TypeScript 泛型动态键接口实现方案

你预期的[T]: string写法不符合TypeScript语法规则，要实现传入字符串字面量泛型指定动态属性名的需求，正确实现方式如下：

核心实现代码

// 约束泛型T必须为字符串类型，同时设置默认键名兼容原有逻辑
export type ChartDataResponseI<T extends string = "point_delivery_number"> = {
  consumption: string
  generation: string
  measure_name: string
  self_coverage: string
  time: string
} & {
  // 通过映射类型定义泛型对应的动态属性
  [K in T]: string
}

关键说明

泛型参数T添加了extends string约束，仅允许传入字符串字面量类型作为参数，符合你传入"point_delivery_number"、"community_number"这类键名的使用要求
给泛型设置了默认值"point_delivery_number"，不传泛型参数时，类型结构和你最开始定义的接口完全一致，不会破坏已有业务代码
采用交叉类型&合并固定属性对象和动态键映射对象，最终类型的使用体验和普通接口没有区别

使用示例

// 用法1：不传泛型，默认使用point_delivery_number作为键名，兼容旧代码
const meterData: ChartDataResponseI = {
  consumption: "125.6",
  generation: "342.1",
  measure_name: "daily_electric",
  point_delivery_number: "PDN20240001",
  self_coverage: "42%",
  time: "2024-05-20 00:00:00"
}

// 用法2：传入自定义键名，适配社区编号场景
const communityData: ChartDataResponseI<"community_number"> = {
  consumption: "12500.6",
  generation: "21420.3",
  measure_name: "daily_electric",
  community_number: "COM20240012", // 此处键名自动匹配传入的泛型字面量
  self_coverage: "68%",
  time: "2024-05-20 00:00:00"
}