4.事件监听

需求

     业务上在预览流程时经常需要实时展示元素信息，比如光标移动到某个BPMN元素上，或者点击元素时，实时提取元素信息。

有两种方式可以实现事件监听。

方法一: eventBus方式

 添加一个div>textarea用来展示提取信息

<div id="console"> <textarea id="js-console" >console</textarea></div>

<style>
#js-console{
  width: 200px;
}
</style>

 添加整年监听代码

  let eventBus = this.bpmnModeler.get('eventBus');
      //同时监听多种事件类型
      const events = [
        'element.hover',
        'element.out',
        'element.click',
        'element.dblclick',
        'element.mousedown',
        'element.mouseup'
      ];

      events.forEach(function (event) {

        eventBus.on(event, function (e) {
          let consoles = document.querySelector('#js-console');
      
          consoles.textContent =&