Aurelia-events

アウレリア-イベント

この章では、Aureliaのイベントについて学びます。

イベントデリゲート

委任でさえも、イベントハンドラーがDOM上の複数の要素ではなく、1つの最上位要素に接続される便利な概念です。 これにより、アプリケーションのメモリ効率が向上するため、可能な限り使用する必要があります。

これは、Aureliaフレームワークでイベント委任を使用する簡単な例です。 ビューには、 click.delegate イベントが添付されたボタンがあります。

appl

<template>
   <button click.delegate = "myFunction()">CLICK ME</button>
</template>

ボタンがクリックされると、* myFunction（）*が呼び出されます。

app.js

export class App {
   myFunction() {
      console.log('The function is triggered...');
   }
}

次の出力が得られます。

Aurelia Events Delegate

イベントトリガー

委任を使用できない場合があります。 一部のJavaScriptイベントは委任をサポートしていません。 IOSは一部の要素でサポートしています。 どのイベントが委任を許可するかを調べるには、イベントhttps://developer.mozilla.org/en-US/[here]の bubble プロパティを検索できます。 これらの場合、* trigger（）*メソッドを使用できます。

上記の例と同じ機能は、 click.trigger を使用して作成できます。

appl

<template>
   <button click.trigger = "myFunction()">CLICK ME</button>
</template>

app.js

export class App {
   myFunction() {
      console.log('The function is triggered...');
   }
}