カスタムイベントを作成・発火して疎結合なコンポーネント通信を行う
// カスタムイベントの定義と発火
const event = new CustomEvent('user:login', {
detail: { userId: 42, name: 'Alice' },
bubbles: true,
cancelable: true,
});
element.dispatchEvent(event);
// イベントの受信
document.addEventListener('user:login', (e: Event) => {
const { userId } = (e as CustomEvent).detail;
console.log('ログイン:', userId);
});コンポーネント間のカスタムイベントバスとして使える。TypeScriptでは型引数でdetailの型を指定できる（CustomEvent<T>）。