交互事件，指的就是用户与UI组件之间交互操作时触发的事件。
一、事件基础语法
我们以最常见的点击事件为例，来学习 ArkTS 中事件相关语法。
1、绑定事件
通过onClick()方法来给组件绑定点击事件：
Button('按钮').onClick(() => {
console.log("点击事件")
})
用户点击页面中的按钮时，会执行onClick()方法，在日志中输出“点击事件”。
步骤如下图所示：
2、事件方法
事件方法，指的就是 onClick() 中的回调函数。
事件方法除了可以设置 build() 方法内部以外，也可以在 build() 同级设置函数来作为事件方法，然后通过 this 来访问对应的方法：
@Entry
@Component
struct MyPage {
// 事件方法
clickEvent = () => {
console.log("点击事件")
}
build() {
Column({ space: 10 }) {
Button('按钮').onClick(this.clickEvent)
Button('按钮').onClick(() => {
this.clickEvent()
})
}
}
}
说明：事件方法，可以是箭头函数也可以是普通函数，但是考虑到后续方法中 this 的使用，建议使用箭头函数；
3、事件传参
事件方法本身是无法实现传参的，因此将需要接收参数的方法（下列中的sayHello）作为普通函数，在真正的事件方法中通过 this 来调用普通函数并传参；
@Entry
@Component
struct MyPage {
sayHello = (name: string) => {
console.log(`你好，${name}`)
}
build() {
Column() {
Button('按钮').onClick(() => {
// 传递参数给sayHello
this.sayHello("张三")
})
}
}
}
4、事件对象
所有的事件方法都会默认接收一个事件对象 event 作为参数：
注意：event 是一个对象，因此在输出时必须使用JSON.stringify() 转换为字符串后再输出。
@Entry
@Component
struct MyPage {
clickEvent = (event: ClickEvent) => {
console.log(JSON.stringify(event))
}
build() {
Column() {
Button('按钮').onClick((event: ClickEvent) => {
console.log(JSON.stringify(event))
})
Button('按钮').onClick(this.clickEvent);
}
}
}
点击按钮后，输出的事件对象内容如下图所示：
二、访问组件方法和状态
在一个事件方法中，是可以通过 this 来访问组件内的其他方法和状态的。
@Entry
@Component
struct MyPage {
@State message: string = "你好";
clickEvent = () => {
// 修改组件内部状态
this.message = "hello"
// 调用组件内部其他方法
this.sayHello();
}
sayHello = () => {
console.log(this.message);
}
build() {
Column() {
Button('按钮').onClick(this.clickEvent)
}
}
}
三、事件类型
作为初学者，我们比较常用的事件类型就是onClick点击事件，但是我们还是需要大概了解一下ArkTS中总共提供了哪些事件类型，每一个事件具体的使用我们可以在后续的学习中慢慢来了解。
ArkTS 提供的事件类型总分为两大类：通用事件和手势事件。
1、通用事件
通用事件按照触发类型来分类，包括触屏事件、键鼠事件、焦点事件和拖拽事件。
- 触屏事件：手指或手写笔在触屏上的单指或单笔操作。
- 键鼠事件：包括外设鼠标或触控板的操作事件和外设键盘的按键事件。
- 鼠标事件是指通过连接和使用外设鼠标/触控板操作时所响应的事件。
- 按键事件是指通过连接和使用外设键盘操作时所响应的事件。
- 焦点事件：通过以上方式控制组件焦点的能力和响应的事件。
- 拖拽事件：由触屏事件和键鼠事件发起，包括手指/手写笔长按组件拖拽和鼠标拖拽。
- 事件分发：描述触控类事件（不包括按键，焦点）响应链的命中收集过程。
2、手势事件
手势事件由绑定手势方法和绑定的手势组成，绑定的手势可以分为单一手势和组合手势两种类型，根据手势的复杂程度进行区分。
