EmberJS-イベントの処理

ダブルクリック、ホバリング、キー押下などのユーザーイベントは、イベントハンドラーで処理できます。これを行うには、コンポーネントのメソッドとしてイベント名を適用します。

たとえば、次のようなテンプレートがあるとします-

{{#double-clickable}}
  //code here
{{/double-clickable}}

あなたが要素をダブルクリックすると、以下に示すようにメッセージが表示されます-

import Ember from 'ember';

export default Ember.Component.extend ({
   doubleClick() {
      document.write("The double click event has occurred!");
   }
});

イベント名

Ember.jsには、タッチ、キーボード、マウス、フォーム、ドラッグアンドドロップなどの次の組み込みイベントが含まれています。

タッチイベント

touchStart
touchMove
touchEnd
touchCancel

キーボードイベント

keyDown
keyUp
keyPress

マウスイベント

mouseDown
mouseUp
コンテキストメニュー
クリック
ダブルクリック
mouseMove
集中する
focusOut
mouseEnte
mouseLeave

フォームイベント

提出する
変化する
集中する
focusOut
入力

HTML5のドラッグアンドドロップイベント

dragStart
drag
dragEnter
dragLeave
dragOver
dragEnd
drop

イベントハンドラを使用して、コンポーネントからアプリケーションにアクションを送信できます。アクションの送信の詳細については、次のリンクを確認してください：/emberjs/emberjs_comp_sending_actions [section]。

Emberjs-comp-handle-events