EmberJS - Tratamento de eventos

Os eventos do usuário, como clique duplo, pairar, pressionar tecla, etc, podem ser manipulados por manipuladores de eventos. Para fazer isso, aplique o nome do evento como um método no componente.

Por exemplo, considere que temos um modelo conforme fornecido abaixo -

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

Quando você clica duas vezes no elemento, ele exibe a mensagem conforme mostrado abaixo -

import Ember from 'ember';

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

Nomes de Eventos

Ember.js contém os seguintes eventos integrados, como eventos de toque, teclado, mouse, formulário, arrastar e soltar.

Eventos de toque

  • touchStart
  • touchMove
  • touchEnd
  • touchCancel

Eventos de teclado

  • keyDown
  • keyUp
  • keyPress

Eventos de mouse

  • mouseDown
  • mouseUp
  • contextMenu
  • click
  • doubleClick
  • mouseMove
  • focusIn
  • focusOut
  • mouseEnte
  • mouseLeave

Eventos de formulário

  • submit
  • change
  • focusIn
  • focusOut
  • input

Eventos de arrastar e soltar HTML5

  • dragStart
  • drag
  • dragEnter
  • dragLeave
  • dragOver
  • dragEnd
  • drop

Você pode usar manipuladores de eventos para enviar ações do componente para o seu aplicativo. Para obter mais informações sobre o envio de ações, consulte a seção a seguir .