ドキュメント/ウィンドウのリスニング

これまでは<button>のようなDOM要素から発生したイベントを扱ってきましたが、グローバルイベントをリスニングする必要がある場合はどうすればよいでしょうか?

一般的なグローバルイベントには、documentmousemoveイベントやwindowscrollイベントなどがあります。

Qwikには、グローバルイベントをリスニングするためのdocument:およびwindow:名前空間プレフィックスがあります。

ブラウザのコンソールを開き、サンプルのテキストの上にマウスを移動してください。マウスの移動に合わせて、マウスの位置がコンソールに記録されることがわかります。このログは、テキスト上にマウスを移動している間だけ発生します。これは、イベントがdivonMouseMoveイベントに接続されているためです。このレベルでアタッチすると、要素のリスナーを超えてイベントのバブリングが停止します。

マウスの位置を常に記録するには、コードをどのように調整すればよいでしょうか?

onMouseMove宣言にdocument:プレフィックスを追加して、グローバルリスナーに変更します。

この変更により、アプリケーションのどこでマウスを移動しても(テキストの外側でも)、コンソールに出力が表示されるようになります。

チュートリアルの編集