> ## Documentation Index
> Fetch the complete documentation index at: https://help.dingtalk.io/llms.txt
> Use this file to discover all available pages before exploring further.
# 事件处理
> 指导如何在宜搭中为组件绑定动作并在动作面板编写 JS 回调，实现点击、值变化等事件的自定义处理逻辑。
事件处理在系统开发中属于最常见的逻辑实现之一，宜搭提供通用的用户动作绑定功能，并提供动作面板用于书写 JS 处理逻辑，通常要实现事件处理功能需要以下两步：
* 给组件增加动作绑定配置（几乎每个组件都有提供相应的动作绑定选项）；
* 在动作面板实现动作处理逻辑；
在进行动作绑定时，用户可以进行动作的参数设置，如下所示，设置的参数在处理函数中可以通过 this.params.xxx 进行读取，其中 xxx 为用户设置的参数。
参数获取方式：
```js theme={"theme":{"light":"github-light","dark":"github-dark"}}
export function onClick(){
const { name, age } = this.params
console.log(name, age);
}
```
## 使用场景
下面介绍一个简单的使用事件处理的例子：
监听一个按钮点击事件并弹框展示相关信息，要实现一个事件处理功能，用户需要进行两部操作：
* 给组件绑定用户操作事件，如下所示，我们给按钮组件绑定一个 onClick 事件；
* 在动作面板中实现相关的事件处理逻辑，当用户点击按钮是，我们会弹一个框显示问候语 (state.name 是我们设置的一个全局变量，初始值为：“小明”)；
用户点击右上角的预览按钮，便可以看到以下预览效果，当用户点击 Hello 按钮，程序弹框显示“Hello 小明”。
