Перейти к основному содержимому
Версия: Next

Работа с событиями документа

API редактора предоставляет удобную систему событий, которая позволяет надстройкам реагировать на разнообразные действия пользователя и внутренние изменения системы.

На эти события можно подписаться, обрабатывать их, а так же отменять регистрацию если отпала необходимость их отслеживания.

Основные события редактора​

DocumentChange​

Генерируется каждый раз, когда изменяется содержание документа, будь то изменения самого пользователя или изменения, сделанные коллегами в режиме совместного редактирования.

editorApi.events.subscribe('documentChange', (payload) => {
    console.log('Изменился документ:', payload);
});

EditorError​

Запускается при появлении внутренних ошибок в редакторе.

Обычно такое событие сигнализирует о проблемах с внутренними компонентами и требует внимания разработчиков.

editorApi.events.subscribe('error', (payload) => {
    console.error('Ошибка в редакторе:', payload);
});

SelectionChange​

Срабатывает всякий раз, когда меняется состояние выделения текста или позиция курсора.

Оно полезно для синхронизации поведения разных компонентов, зависящих от активности пользователя.

editorApi.events.subscribe('selectionChange', (payload) => {
    console.log('Состояние выделения изменилось:', payload);
});

ViewportChange​

Выполняется при каждой смене видимой области документа, например, при прокрутке или масштабировании.

Используется для оптимизации загрузки контента или адаптации UI-компонентов.

editorApi.events.subscribe('viewportChange', (payload) => {
    console.log('Видимая область изменилась:', payload);
});

Временная регистрация обработчика событий​

Также возможно подписываться на события всего лишь на короткий промежуток времени, после которого автоматически прекращается обработка события.

Пример временной подписки:

function subscribeForTime(duration = 5000) {
    let timeoutHandle;

    // Подписываемся на событие viewportChange
    const unsubscribe = editorApi.events.subscribe('viewportChange', (payload) => {
        clearTimeout(timeoutHandle); // Сбрасываем таймаут, если сработало раньше
        console.log('viewportChange произошло в течение первых 5 сек.', payload);
    });

    // Устанавливаем таймер отмены подписки через 5 секунд
    timeoutHandle = setTimeout(unsubscribe, duration);
}

Подписка на событие один раз​

Если необходимо подписаться на событие всего единожды, то можно воспользоваться специальным методом subscribeOnce, который автоматически отписывает обработчик после первого же срабатывания события.

Пример однократной подписки на событие изменения видимости окна редактора:

// Однократная подписка на событие изменения видимой области документа
editorApi.events.subscribeOnce('viewportChange', (payload) => {
    console.log('Видимая область изменилась:', payload);
});

Особенности метода​

  • Обработчик вызывается только один раз.
  • Автоматическое удаление обработчика после первого запуска события.
  • Удобно для простых случаев, когда нужно произвести какое-то действие всего один раз (например, загрузить начальные данные или провести первую настройку компонента).

Альтернативный вариант: временная подписка через обычную подписку и таймер​

Если по каким-то причинам не хочется использовать метод subscribeOnce, можно самостоятельно установить временное ограничение через классический таймер как описано выше.