Service for application-wide event communication

The EventDispatcher enables loosely-coupled communication between components through a publish-subscribe pattern.

Components can dispatch custom events and subscribe to events from other components without direct coupling. This is particularly useful for:

  • Cross-component communication
  • Responding to platform-level events (navigation, data changes)
  • Notifying other components of state changes

Example

Basic usage

const eventDispatcher = platform.get(PlatformServiceName.EventDispatcher);

// Dispatch an event
eventDispatcher.dispatch('data-changed', { id: 123 });

// Listen for events
const handler = (event: CustomEvent<{ id: number }>) => {
console.log('Data changed:', event.detail.id);
};
eventDispatcher.addListener('data-changed', handler);

// Clean up
eventDispatcher.removeListener('data-changed', handler);

Hierarchy

  • EventDispatcher

Methods

  • Register a listener for a specific event type

    The listener function will be called whenever an event with the matching name is dispatched. The same listener can be registered multiple times, but should typically be registered only once per component instance.

    Important: Always remove listeners in disconnectedCallback() to prevent memory leaks.

    Example

    eventDispatcher.addListener('message-received', (event) => {
    console.log('Message:', event.detail);
    });

    Type Parameters

    • T

    Parameters

    • eventName: string

      Name of the event to listen for

    • listener: ((event: CustomEvent<T>) => void)

      Callback function to invoke when the event is dispatched

        • (event: CustomEvent<T>): void
        • Parameters

          • event: CustomEvent<T>

          Returns void

    Returns void

  • Dispatch a custom event to all registered listeners

    Creates and dispatches a CustomEvent with the provided data. All components that have registered listeners for this event name will be notified.

    Returns

    The CustomEvent that was dispatched

    Example

    const eventDispatcher = platform.get(PlatformServiceName.EventDispatcher);
    eventDispatcher.dispatch('item-selected', { itemId: 42, name: 'Widget' });

    Type Parameters

    • T

    Parameters

    • eventName: string

      Unique name identifying the event type

    • data: T

      Data payload to include in the event's detail property

    Returns CustomEvent<T>

  • Unregister a previously registered event listener

    Removes the specified listener function for the given event name. The listener reference must be the same function instance that was passed to addListener.

    Always call this in disconnectedCallback() to clean up listeners and prevent memory leaks.

    Example

    const handler = (event: CustomEvent<string>) => console.log(event.detail);
    eventDispatcher.addListener('message-received', handler);
    eventDispatcher.removeListener('message-received', handler);

    Type Parameters

    • T

    Parameters

    • eventName: string

      Name of the event to stop listening for

    • listener: ((event: CustomEvent<T>) => void)

      The exact listener function that was previously registered

        • (event: CustomEvent<T>): void
        • Parameters

          • event: CustomEvent<T>

          Returns void

    Returns void