-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
-
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
-
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
keyboard_arrow_right keyboard_arrow_down
-
-
keyboard_arrow_right keyboard_arrow_down
-
-
-
keyboard_arrow_right keyboard_arrow_down
- YCLIENTS
- Маркетплейс интеграций
- Плагинизация
- Руководство по созданию Frontend плагина
- Событийная модель
- DocumentEventEmitter
DocumentEventEmitter
Класс для работы с событиями документа. Реализует интерфейс IDocumentEventEmitter
и добавляет обработку событий на уровне document
.
Основные возможности
- Подписка на события документа
- Отправка событий на уровне документа
- Типизированная работа с событиями
- Автоматическая очистка слушателей
API Reference
Методы
onDocument(eventName, listener)
Подписка на событие документа.
onDocument<T>(eventName: string, listener: CustomEventListener<T>): void
offDocument(eventName, listener)
Отписка от события документа.
offDocument<T>(eventName: string, listener: CustomEventListener<T>): void
emit(eventName, detail)
Отправка события на уровне документа.
emit(eventName: string, detail?: T): void
Примеры использования
Базовое использование
import { DocumentEventEmitter } from '@yclients-plugins/utils'; const emitter = new DocumentEventEmitter<string>(); // Подписка на событие emitter.onDocument('user-login', (event) => { console.log('User logged in:', event.detail); }); // Отправка события emitter.emit('user-login', 'john.doe@example.com');
Использование с интерфейсами
import { DocumentEventEmitter } from '@yclients-plugins/utils'; interface UserData { id: number; name: string; email: string; } const emitter = new DocumentEventEmitter<UserData>(); // Подписка на событие emitter.onDocument('user-update', (event) => { console.log('User updated:', event.detail.name); }); // Отправка события emitter.emit('user-update', { id: 1, name: 'John Doe', email: 'john@example.com', });
Использование в плагинах
import { DocumentEventEmitter } from '@yclients-plugins/utils'; interface PluginEvent { type: 'ready' | 'update'; payload: any; } class MyPlugin { private eventEmitter = new DocumentEventEmitter<PluginEvent>(); init() { // Подписка на события хоста this.eventEmitter.onDocument('host-ready', (event) => { console.log('Host is ready:', event.detail); }); // Отправка события готовности плагина this.eventEmitter.emit('plugin-ready', { type: 'ready', payload: { status: 'initialized' }, }); } }
Использование с универсальным типом TPluginEvent
import { DocumentEventEmitter, TPluginEvent } from '@yclients-plugins/utils'; interface UserEvent { id: number; name: string; } const emitter = new DocumentEventEmitter<TPluginEvent<UserEvent>>(); // Подписка на событие emitter.onDocument('user:created', (event) => { console.log('User created:', event.detail.payload.name); console.log('Container ID:', event.detail.containerId); console.log('Area:', event.detail.area); }); // Отправка события emitter.emit('user:created', { area: 'my-plugin-area', containerId: 'container-123', payload: { id: 1, name: 'John Doe', }, });
Использование глобального DocumentEventEmitter
import { documentEventEmitter } from '@yclients-plugins/utils'; // Подписка на глобальное событие документа documentEventEmitter.onDocument('app:initialized', (event) => { console.log('Application initialized:', event.detail); }); // Вызов глобального события документа documentEventEmitter.emit('app:initialized', { version: '1.0.0' });
Экспорты
Основные экспорты
import { DocumentEventEmitter } from '@yclients-plugins/utils';
Глобальный синглтон
import { documentEventEmitter } from '@yclients-plugins/utils';
Типы
import type { CustomEventListener } from '@yclients-plugins/utils';
Была ли статья полезна?