通用 object 屬性

Question

我有這個界面

export interface ChartDataResponseI {
  consumption: string
  generation: string
  measure_name: string
  point_delivery_number: string
  self_coverage: string
  time: string
}

我想要實現的是盡可能使point_delivery_number成為通用的 object 屬性

它應該看起來像這樣：

export interface ChartDataResponseI<T> {
  consumption: string
  generation: string
  measure_name: string
  [T]: string
  self_coverage: string
  time: string
}

所以我可以像這樣傳遞密鑰：

ChartDataResponse<"point_delivery_number">

或者

ChartDataResponse<"community_number">

Answer 1

您可以使用一個簡單的交集。

interface ChartDataResponseI {
  consumption: string
  generation: string
  measure_name: string
  self_coverage: string
  time: string  
}

type ChartDataWithProp<T> = ChartDataResponseI & T;

const chartData: ChartDataWithProp<{point_delivery_number: number, round: string}> = {
  consumption: 'string',
  generation: 'string',
  measure_name: 'string',
  self_coverage: 'string',
  time: 'string',  
  point_delivery_number: 2,
  round: 'yes'
};

TS游樂場

Answer 2

你真的需要通用嗎？ 如果您只有這兩個可能不同的鍵，請考慮以下內容：

interface ChartDataResponse {
  consumption: string
  generation: string
  measure_name: string
  self_coverage: string
  time: string
}

export interface ChartDataResponsePointDelivery extends ChartDataResponse {
    point_delivery_number: number
}

export interface ChartDataResponseCommunity extends ChartDataResponse {
    community_number: number
}

現在您有一個基本的ChartDataResponse接口，它針對這兩種不同的情況進行了擴展。 如果需要，也很容易進一步擴展它。 ChartDataResponsePointDelivery和ChartDataResponseCommunity都具有ChartDataResponse的所有鍵以及附加鍵。

另請注意，基本接口根本不會導出，因此您不會不小心使用這兩個鍵都沒有使用基本接口。

通常，當您處於需要接受“任何對象”的情況下時，您如何處理這種情況存在更深層次的問題。 TypeScript 的全部意義在於強制執行並讓您知道您正在處理的對象類型以及它們具有的鍵。

Answer 3

使用 inheritance

interface ChartDataResponseI {
  consumption: string
  generation: string
  measure_name: string
  //point_delivery_number: string <- if its not default remove it
  self_coverage: string
  time: string
}

interface another extends ChartDataResponseI {
  point_delivery_number: string
  //or
  anything: string
}