アウレリア-イベント
この章では、Aureliaイベントについて学習します。
イベントデリゲート
委任でさえ、イベントハンドラーがDOM上の複数の要素ではなく、1つのトップレベル要素にアタッチされる便利な概念です。これにより、アプリケーションのメモリ効率が向上するため、可能な限り使用する必要があります。
これは、Aureliaフレームワークでイベント委任を使用する簡単な例です。私たちのビューにはボタンがありますclick.delegate イベント添付。
app.html
<template>
<button click.delegate = "myFunction()">CLICK ME</button>
</template>
ボタンがクリックされると、 myFunction() と呼ばれます。
app.js
export class App {
myFunction() {
console.log('The function is triggered...');
}
}
次の出力が得られます。
イベントトリガー
委任を使用できない場合があります。一部のJavaScriptイベントは委任をサポートしていません。IOSはいくつかの要素でそれをサポートしています。委任を許可するイベントを見つけるには、bubbleここでのイベントのプロパティ。このような場合は、trigger() 方法。
上記の例と同じ機能は、 click.trigger。
app.html
<template>
<button click.trigger = "myFunction()">CLICK ME</button>
</template>
app.js
export class App {
myFunction() {
console.log('The function is triggered...');
}
}