事件

对工作区的每一次更改都会触发事件。这些事件会完整描述每项更改之前和之后的状态。

监听事件

工作区具有 addChangeListenerremoveChangeListener 方法,可用于监听事件流。例如实时生成代码。另一个示例是块上限演示。通常情况下,这两个示例并不关心触发事件是什么。他们只会着眼于工作区的当前状态。

更复杂的事件监听器会检查触发事件。以下示例会检测用户何时创建了第一条评论,发出了提醒,然后停止监听,因而不再触发提醒。

function onFirstComment(event) {
  if (event.type == Blockly.Events.BLOCK_CHANGE &&
      event.element == 'comment' &&
      !event.oldValue && event.newValue) {
    alert('Congratulations on creating your first comment!')
    workspace.removeChangeListener(onFirstComment);
  }
}
workspace.addChangeListener(onFirstComment);

为了监听浮出控件中发生的任何事件,可以将监听器添加到浮出控件的工作区中。

var flyoutWorkspace = yourWorkspace.getFlyout().getWorkspace();
flyoutWorkspace.addChangeListener(onFirstComment);

块还有另一种监听事件流的方法。块可以定义 onchange 函数,或使用 setOnChange 设置一个函数,每当块的工作区发生更改时,系统都会调用该函数。

事件类型

如需了解各个事件,请参阅参考文档

演示

如需查看事件的强大功能,您可以查看镜像演示。此演示包含两个 Blockly 工作区,它们使用事件保持同步。