[解決済み] typescript インターフェースは、次の2つのプロパティのうちどちらかが存在する必要があります。

質問

を持つようなインターフェイスを作成しようとしています。

export interface MenuItem {
  title: string;
  component?: any;
  click?: any;
  icon: string;
}

1. を要求する方法はありますか？ component または click を設定します。
2. 両方のプロパティを設定できないようにする方法はありますか？

どのように解決するのですか？

型は条件論理を持たず、互いに依存することができないので、単一のインターフェースでは無理ですが、インターフェースを分割することで可能です。

export interface BaseMenuItem {
  title: string;
  icon: string;
}

export interface ComponentMenuItem extends BaseMenuItem {
  component: any;
}

export interface ClickMenuItem extends BaseMenuItem {
    click: any;
}

export type MenuItem = ComponentMenuItem | ClickMenuItem;