Аурелия - События

В этой главе вы узнаете о событиях Aurelia.

Делегат мероприятия

Равномерное делегирование - полезная концепция, когда обработчик событий прикрепляется к одному элементу верхнего уровня, а не к нескольким элементам в DOM. Это повысит эффективность использования памяти приложения и должно использоваться по возможности.

Это простой пример использования делегирования событий с фреймворком 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...');
   }
}