我那些介面：
export interface EventCollectorData {
eventType: EventCollectorType;
}
export interface ClickEventCollectorData extends EventCollectorData {
elementData: EventCollectorElementLocator;
eventType: EventCollectorType.CLICK;
}
export interface NetworkEventCollectorData extends EventCollectorData {
eventType: EventCollectorType.REQUEST;
requestData: {
method: NetworkMethod;
url: string;
headers: Object;
body: {
json: Object | null;
text: string | null;
formData: any;
};
};
}
export type EventCollectorDataType = ClickEventCollectorData | NetworkEventCollectorData;
當我想使用 EventCollectorDataType 并檢查是否存在elementData或requestData是否存在時，出現此錯誤：
型別“EventCollectorDataType”上不存在屬性“elementData”。“NetworkEventCollectorData”型別不存在屬性“elementData”。
這是我要執行此檢查的函式的示例：
const check = (eventCollector: EventCollectorDataType) {
if (eventCollector.elementData) {
} else if (eventCollector.requestData) {
}
}
我怎樣才能實作這樣的事情？
uj5u.com熱心網友回復：
在訪問僅存在于聯合的一部分的屬性之前，您需要縮小要處理的型別的范圍。根據您的設定方式，該eventType屬性非常適合此操作（它形成了一個受歧視的聯合），因此我建議如下：
const check = (eventCollector: EventCollectorDataType) {
if (eventCollector.eventType === EventCollectorType.CLICK) {
// do stuff with eventCollector.elementData
} else if (eventCollector.eventType === EventCollectorType.REQUEST) {
// do stuff with eventCollector.requestData
}
}
縮小范圍的另一種方法是這樣的：
if ('elementData' in eventCollector) {
} else if ('requestData' in eventCollector) {
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/387160.html
標籤：javascript 打字稿
上一篇：如何創建遞回型別？