注意
Microsoft Graph Toolkit は非推奨です。 2025 年 9 月 1 日から、2026 年 8 月 28 日に完全な退職が予定されています。 開発者は、Web エクスペリエンスを構築するために、Microsoft Graph SDK またはその他のサポートされている Microsoft Graph ツールを使用して移行する必要があります。 詳細については、 非推奨のお知らせを参照してください。
多くの Microsoft Graph Toolkit コンポーネントは、カスタム イベントを生成します。 これらのイベントにイベント ハンドラーをアタッチすると、それらに応答し、アプリの動作を制御できます。
コンポーネントが生成するイベントを検出する
各 Microsoft Graph Toolkit コンポーネントは、その機能に固有の異なるイベントを生成します。 特定のコンポーネントによって生成されるイベントの一覧を表示するには、そのコンポーネントのドキュメントの 「イベント 」セクションを参照してください。
重要
ファイル リスト コンポーネントの itemClick などの一部のイベントは、既定のテンプレートを使用している場合にのみ生成されます。 カスタム テンプレートを使用する場合は、イベントの生成を担当する既定のレンダリングを上書きします。
イベントにイベント ハンドラーを追加する
Microsoft Graph Toolkit では、標準の EventTarget.dispatchEvent() 関数を使用して、そのコンポーネントにカスタム イベントを出力します。 ツールキットのコンポーネントによって生成されるカスタム イベントにイベント ハンドラーをアタッチするには、標準の EventTarget.addEventListener() 関数を使用します。
たとえば、ファイル リスト コンポーネントによって生成される itemClick イベントを処理するには、コードに次を追加します。
document.querySelector('mgt-file-list').addEventListener('itemClick', e => {
// your event handler code goes here
});
イベントによって公開される追加情報にアクセスする
Microsoft Graph Toolkit によって生成される一部のイベントには、イベントに関連する追加情報が含まれています。 たとえば、ファイル リスト コンポーネントによって生成される itemClick イベントには、ファイル 一覧でクリックされたファイルに関する情報が含まれます。 特定のイベントに追加情報が含まれているかどうかを確認するには、対応するコンポーネントのドキュメントの 「イベント 」セクションを参照してください。
次の例に示すように、イベント ハンドラーに渡されるevent オブジェクトの details プロパティを使用して、イベントによって公開される追加情報にアクセスできます。
document.querySelector('mgt-file-list').addEventListener('itemClick', e => {
const clickedFile = e.details;
});