handleEventListener
Category Browser
Convenience wrapper for event listeners.
Demo
Click me ! Open the console and change the page to see the logs
Usage
<script>
import { handleEventListener } from '@sv-use/core';
handleEventListener('click', () => {
console.log('clicked')
});
</script>Type definitions
import type { Arrayable, CleanupFunction } from '../../__internal__/types.js';
interface InferEventTarget<Events> {
addEventListener: (event: Events, fn?: any, options?: any) => any;
removeEventListener: (event: Events, fn?: any, options?: any) => any;
}
type GeneralEventListener<EventType extends Event = Event> = (evt: EventType) => void;
type HandleEventListenerOptions = AddEventListenerOptions & {
/**
* Whether to auto-cleanup the event listeners or not.
*
* If set to `true`, it must run in the component initialization lifecycle.
* @default true
*/
autoCleanup?: boolean;
};
export declare function handleEventListener<WindowEvent extends keyof WindowEventMap>(event: Arrayable<WindowEvent>, listener: Arrayable<(this: Window, ev: WindowEventMap[WindowEvent]) => unknown>, options?: HandleEventListenerOptions): CleanupFunction;
export declare function handleEventListener<WindowEvent extends keyof WindowEventMap>(element: Window, event: Arrayable<WindowEvent>, listener: Arrayable<(this: Window, ev: WindowEventMap[WindowEvent]) => unknown>, options?: HandleEventListenerOptions): CleanupFunction;
export declare function handleEventListener<DocumentEvent extends keyof DocumentEventMap>(element: Document, event: Arrayable<DocumentEvent>, listener: Arrayable<(this: Window, ev: DocumentEventMap[DocumentEvent]) => unknown>, options?: HandleEventListenerOptions): CleanupFunction;
export declare function handleEventListener<CustomElement extends HTMLElement, ElementEvent extends keyof HTMLElementEventMap>(element: CustomElement, event: Arrayable<ElementEvent>, listener: Arrayable<(this: CustomElement, ev: HTMLElementEventMap[ElementEvent]) => unknown>, options?: HandleEventListenerOptions): CleanupFunction;
export declare function handleEventListener<Name extends string, EventType extends Event = Event>(element: InferEventTarget<Name>, event: Arrayable<Name>, listener: Arrayable<GeneralEventListener<EventType>>, options?: HandleEventListenerOptions): CleanupFunction;
export declare function handleEventListener<EventType extends Event = Event>(element: EventTarget, event: Arrayable<string>, listener: Arrayable<GeneralEventListener<EventType>>, options?: HandleEventListenerOptions): CleanupFunction;
export {};