Skip to main content

Class: MultiTargetEventListenerManager

MultiTargetEventListenerManager allows you to add event listeners to multiple HTML elements (targets) with support for event types with namespace, allow removing events without having to pass a callback and makes it possible to remove all event lsiteners from all HTML elements in a much simpler avoiding leaving listeners behind which would result in memory leaks.

Example​

Adding and removing event listeners

  const eventListenerManager = new MultiTargetEventListenerManager()
  const element1 = document.getElementById('foo');
  const element2 = document.getElementById('bar');
  const mouseoverCallback = () => { };
  const mouseoutCallback = () => { };
  const dragCallback = () => { };

  eventListenerManager.addEventListener(element1, 'mouseover', mouseoverCallback);
  eventListenerManager.addEventListener(element1, 'mouseout', mouseoutCallback);

  eventListenerManager.addEventListener(element2, 'voi.mousemove', dragCallback);
  eventListenerManager.addEventListener(element2, 'voi.drag', dragCallback);
  eventListenerManager.addEventListener(element2, 'voi.mouseup', () => {
    // do not need to store a reference of this function
  }));

  // Removes a specific event listener from element2
  eventListenerManager.removeEventListener(element2, 'voi.mousemove', dragCallback)

  // Removes all "mouseup" event listeners added to "voi" namespace on element2
  eventListenerManager.removeEventListener(element2, 'voi.mouseup')

  // Removes all event listeners added to element1 and element2
  eventListenerManager.reset();

Constructors​

new MultiTargetEventListenerManager()​

new MultiTargetEventListenerManager(): MultiTargetEventListenerManager

Returns​

MultiTargetEventListenerManager

Methods​

addEventListener()​

addEventListener(target, type, callback, options?): void

Parameters​

• target: EventTarget

• type: string

• callback: EventListener

• options?: AddEventListenerOptions

Returns​

void

Defined in​

packages/core/src/utilities/eventListener/MultiTargetEventListenerManager.ts:42

removeEventListener()​

removeEventListener(target, type, callback?, options?): void

Parameters​

• target: EventTarget

• type: string

• callback?: EventListener

• options?: EventListenerOptions

Returns​

void

Defined in​

packages/core/src/utilities/eventListener/MultiTargetEventListenerManager.ts:58

reset()​

reset(): void

Returns​

void

Defined in​

packages/core/src/utilities/eventListener/MultiTargetEventListenerManager.ts:77