Skip to main content

触发条件

一个组件的事件由触发条件以及执行动作两部分构成,执行动作又分为 平台方法 和自定义方法,本文章主要对触发条件进行说明。

触发条件说明

不同的组件存在不同类型的触发条件,例如按钮的单击、输入框的聚焦等。同时不同的触发条件在执行时都会返回 event 对象,我们可以通过获取 event 对象中的值来实现一些常见功能。

什么是 event 对象

在微搭中,当一个组件的触发条件被触发时则会返回该触发条件的 event 对象,触发条件不同,返回的 event 对象中存储的值也不同。我们可以通过自定义方法来打印 event,查看其结构,下文为打印 event 的演示示例:

  1. 单击左上角的菜单按钮,随后单击进入代码编辑器。在当前页面的 handler 文件夹下添加自定义方法。
  2. 编写打印 event 的自定义方法,方法示例如下。
export default function({event, data}) {
console.log(event);
}
  1. 在编辑器中创建一个单行输入组件。
  2. 右侧属性配置区 > 事件,选择触发条件为 change(值改变),选择 javascript 方法,执行动作选择刚刚创建的自定义方法(printdata)。
  3. 开启实时预览,在输入框中进行输入改变的操作,查看下方开发调试工具(面板 > 开发调试工具)控制台中的打印信息。
  4. 根据上图所示,我们便可以在编辑器中通过使用 event.detail.value 来调用当前触发条件所返回的值。

TODO:不同组件的触发条件与 event 对象