- Aurelia 教程
- Aurelia - 主页
- Aurelia - 概述
- Aurelia - 环境设置
- Aurelia - 第一个应用程序
- Aurelia - 组件
- Aurelia - 组件生命周期
- Aurelia - 自定义元素
- Aurelia - 依赖注入
- Aurelia - 配置
- Aurelia - 插件
- Aurelia - 数据绑定
- Aurelia - 绑定行为
- Aurelia - 转换器
- Aurelia - 事件
- Aurelia - 事件聚合器
- Aurelia - 表单
- Aurelia - HTTP
- Aurelia - Refs
- Aurelia - 路由
- Aurelia - 历史记录
- Aurelia - 动画
- Aurelia - 对话框
- Aurelia - 本地化
- Aurelia - 工具
- Aurelia - 捆绑
- Aurelia - 调试
- Aurelia - 社区
- Aurelia - 最佳实践
- 有用 Aurelia 资源
- Aurelia - 快速指南
- 有用 Aurelia 资源
- Aurelia - 讨论
Aurelia - 事件
在本章中,您将了解 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 支持某些元素的委派。要找出哪些事件允许委派,您可以在此处 搜索任何事件的冒泡属性。在这些情况下,您可以使用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...');
}
}
广告