我有這樣一個介面：
interface IInternalListener {
element: HTMLElement,
id: string,
type: string,
listener: EventListenerOrEventListenerObject。
useCapture: boolean
}
我還想使用這個介面：
我還想使用這個介面。
interface IListener {
element: HTMLElement,
id: string | number,
type: string,
listener: EventListenerOrEventListenerObject。
useCapture: boolean
}
唯一的區別是id的型別。我想采用DRY（Don't Repeat Yourself）
我怎樣才能在不復制粘貼的情況下創建這個。映射型別似乎是一種方法，但在這個答案中，他們正在映射所有的道具 - 型別描述：如何創建一個型別的副本但改變屬性型別
我只想改變一個道具。有誰知道如何做到這一點？我不需要使用映射的型別，任何可行的解決方案都是公平的。TIA
uj5u.com熱心網友回復：
有幾種方法可以做到這一點。
方法1
將共同的邏輯提取到第三個介面中，其他兩個介面進行擴展。interface IWhatever {
element: HTMLElement。
type: string,
listener: EventListenerOrEventListenerObject。
useCapture: boolean
}
介面IListener extends IWhatever {
id: string
}
介面 IInternalListener extends IWhatever {
id: string | number
}
方式2
正如Robby Cornelissen在評論中指出的，你可以使用一個通用的：interface IListener< T> {
id: T
element: HTMLElement。
type: string,
listener: EventListenerOrEventListenerObject。
useCapture: boolean
}
第3種方法
假設你不擁有IListener介面，也不能改變它，但你想為你的其他介面重用它的大部分內容：interface IInternalListener extends Omit<IListener, 'id'/span>> {
id: string | number
}
uj5u.com熱心網友回復：
你可以同時使用extends和Omit實用型別。
示例
interface IInternalListener {
element: HTMLElement,
id: string,
type: string,
listener: EventListenerOrEventListenerObject。
useCapture: boolean
}
介面IListener extends Omit<IInternalListener, 'id'/span>> {
id: string | number
}
基本上，我們將洗掉id屬性，然后用你需要的首選型別將其添加回來。
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/332473.html
標籤：