外部コンポーネントを構成する

外部コンポーネント・イベント

日本語翻訳に関する免責事項

このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。

Externalページコンポーネントを設定して、さまざまなシステムイベントに登録できます。これらのイベントのいずれかが発生するたびに、関連データがページコンポーネントに渡されます。

エンティティイベント

次の表に、エンティティイベントを示します。

出来事	トリガー	イベントデータ
ENTITY_UPDATED	entity (id)が更新されます。	エンティティオブジェクト
ENTITY_CREATED	entityが作成されます。	エンティティオブジェクト
ENTITY_SAVED	entity (id)が保存されます。	エンティティオブジェクト
ENTITY_REFRESHED	entity (id)が更新されます。	エンティティオブジェクト
ENTITY_DELETED	entity (id)が削除されます。	エンティティオブジェクト
ENTITY_CHANGED	エンティティ (id) のmemberNameが変更されます。	メンバー値
SEARCH_FINISHED	検索が完了しました。
SELECTION_CHANGED	選択内容が変更されます。
ANNOTATION_SELECTED	Annotationsサイドバーで注釈が選択されます。	次のデータがイベントに渡されます。 `ANNOTATION_SELECTED: { annotationId: string; annotationEntityId: number; }`
ANNOTATION_DESELECTED	Annotationsサイドバーの注釈の選択が解除されます。	次のデータがイベントに渡されます。 `ANNOTATION_DESELECTED: { annotationId: string; annotationEntityId: number; }`

リアルタイムイベント

次の表に、リアルタイムイベントを示します。

出来事	トリガー	イベントデータ
realtime (notificationType)	real-time notificationを受信しました。	通知パラメータ

次のデータがイベントに渡されます。

ENTITY_CREATED: {
    definitionName: string;
    id?: number;
    modified?: Date;
    stopPropagation?: boolean;
};

ENTITY_DELETED: {
    definitionName: string;
    id?: number;
};

ENTITY_SAVED: {
    id: number;
    definitionName: string;
    modified?: Date;
};

ENTITY_REFRESHED: {
    id: number;
    modified: Date;
};

ENTITY_UPDATED: {
    id: number;
    definitionName?: string;
    modified: Date;
};

ENTITY_CHANGED: {
    id: number;
    type: "systemProperty | property | relation";
    memberName: string;
    value: unknown;
};

SEARCH_FINISHED: {
    searchIdentifier: string;
    fullText: string;
    filters: Array<FieldFilterResponseResource>;
    ids: Array<number>;
};

SELECTION_CHANGED: {
    selectionPoolIdentifier: string;
    subPoolId?: number;
    action: "add" | "remove" | "clear";
    ids?: Array<number>;
    definitionNames: Array<string>;
}

エンティティ保存イベント

ENTITY_SAVEDイベントをサブスクライブするには、次のコードを使用します。

const onEntitySaved = (evt: Event): void => {
    const { definitionName, id } = (evt as CustomEvent<{ definitionName: string; id: number }>).detail;

    alert(`Entity with id ${id} and definition ${definitionName} was saved`);
};

window.addEventListener("ENTITY_SAVED", onEntitySaved);

エンティティ変更イベント

ENTITY_CHANGEDイベントの後に受信されるデータの形式は、変更されたデータのタイプによって異なります。たとえば、システム・プロパティーが変更された場合、受信されるデータの形式は次のようになります。

{
  id: number;
  type: "systemProperty",
  memberName: string;
  value: unknown;
}

通常のプロパティが変更された場合、受信されるデータの形式は次のものになります。

{
  id: number;
  type: "property",
  memberName: string;
  value: unknown;
}

allow_navigationが有効になっているリレーションが変更された場合、受信されるデータの形式は次のとおりです。

{
  id: number;
  type: "relation",
  memberName: string;
  value: Array<number>;
  allowNavigation: true;
  role?: "Parent" | "Child" | undefined;
}

allow_navigationが無効になっているリレーションが変更された場合、受信するデータの形式は次のものになります。

{
  id: number;
  type: "relation",
  memberName: string;
  allowNavigation: false;
  role?: "Parent" | "Child" | undefined;
}

Search finishedイベント

SEARCH_FINISHEDイベントを監視する場合は、getEventSearchIdentifierメソッドを使用して、searchIdentifierとイベントのを比較します。

 const onSearchFinished = (evt: Event): void => {
      const {
        filters,
        searchIdentifier: eventSearchIdentifier, // We rename the property to eventSearchIdentifier.
        fullText,
      } = (
        evt as CustomEvent<{
          searchIdentifier: string;
          fullText: string;
          filters: Array<FieldFilterResponseResource>;
          ids: Array<number>;
        }>
      ).detail;

      // We check if the searchIdentifier on the event is the one we are interested in.
      if (
        eventSearchIdentifier === getEventSearchIdentifier(searchIdentifier)
      ) {
        setAppliedSearchFilters(filters);
        setFullTextFilterValue(fullText);
      }
    };

    window.addEventListener("SEARCH_FINISHED", onSearchFinished);

メモ

Reactでは、外部コンポーネントのレンダリング時にエンティティがすでにロードされているため、ENTITY_LOADEDイベントとENTITY_UNLOADEDイベントは不要になりました。最初の初期化は、renderメソッドではなくコードのルートで行うことをお勧めします。そうしないと、初期化ロジックが不必要に繰り返されます。

この記事を改善するための提案がある場合は、お知らせください!