Прослушивание объектов document/window

До сих пор вы имели дело с событиями на элементах DOM, таким как <button>, но что если вам нужно прослушивать глобальные события?

Общие глобальные события включают в себя mousemove документа и scroll окна.

В Qwik есть префиксы пространств имен document: и window:, которые позволяют прослушивать глобальные события.

Откройте консоль браузера и наведите курсор мыши на текст в этом примере. Обратите внимание, как перемещение мыши регистрирует положение мыши в консоли. Это логирование происходит только при перемещении мыши по тексту, потому что привязано к событию onMouseMove элемента div. Привязка на этом уровне останавливает всплытие события за пределы слушателя элемента.

Как вы можете написать код, чтобы постоянно логировать положение мыши?

Измените глобальный слушатель, добавив префикс document: к объявлению onMouseMove.

После изменения обратите внимание, как перемещение мыши в любом месте приложения (даже за пределами текста) показывает вывод в консоли.

Edit Tutorial