Gérer les événements exposés par les composants du Kit de ressources Microsoft Graph

De nombreux composants du Kit de ressources Microsoft Graph émettent des événements personnalisés. L’attachement de gestionnaires d’événements à ces événements vous permet d’y répondre et de contrôler le comportement de votre application.

Découvrir les événements que les composants émettent

Chaque composant du Kit de ressources Microsoft Graph émet des événements différents, spécifiques à ses fonctionnalités. Pour afficher la liste des événements émis par le composant spécifique, consultez la section Événements de la documentation de ce composant.

Importante

Certains événements, comme itemClick dans le composant Liste de fichiers, sont émis uniquement lors de l’utilisation du modèle par défaut. Si vous utilisez un modèle personnalisé, vous remplacez le rendu par défaut qui est responsable de l’émission de l’événement.

Ajouter des gestionnaires d’événements aux événements

Microsoft Graph Toolkit utilise la fonction standard EventTarget.dispatchEvent() pour émettre des événements personnalisés dans ses composants. Pour attacher un gestionnaire d’événements à un événement personnalisé émis par le composant d’un kit de ressources, utilisez la fonction standard EventTarget.addEventListener() .

Par exemple, pour gérer l’événement itemClick émis par le composant Liste de fichiers, ajoutez ce qui suit à votre code.

document.querySelector('mgt-file-list').addEventListener('itemClick', e => {
  // your event handler code goes here
});

Accéder aux informations supplémentaires exposées par l’événement

Certains événements émis par le Kit de ressources Microsoft Graph contiennent des informations supplémentaires relatives à l’événement. Par exemple, l’événement itemClick , émis par le composant File list, contient des informations sur le fichier sur lequel l’utilisateur a cliqué dans la liste des fichiers. Pour voir si l’événement particulier contient des informations supplémentaires, consultez la section Événements de la documentation du composant correspondant.

Vous pouvez accéder aux informations supplémentaires exposées par un événement via la details propriété de l’objet event passé dans votre gestionnaire d’événements, comme illustré dans l’exemple suivant.

document.querySelector('mgt-file-list').addEventListener('itemClick', e => {
  const clickedFile = e.details;
});