打字稿中的 JointJS 事件处理程序答案

【问题标题】：JointJS event handler in typescript打字稿中的 JointJS 事件处理程序
【发布时间】：2017-05-20 11:56:31
【问题描述】：

我正在尝试在 typescript 中为jointjs 论文添加事件处理程序，但没有找到使用joint js 定义文件实现它的方法。

private paper = new joint.dia.Paper({
          el: $('#paper'),
          width: 650,
          height: 400,
          gridSize: 20,
          model: this.graph,
          markAvailable: true,
          linkConnectionPoint: joint.util.shapePerimeterConnectionPoint,
          snapLinks: true
     });

   this.paper.on('mouseclick', () => {
      console.log('Congratulations, you clicked the mouse!');
   });

获取错误信息

TS1068：意外的令牌。需要构造函数、方法、访问器或属性。

如何使用 typescript 为 rect 和 lines 添加事件处理程序？

【问题讨论】：

标签： typescript jointjs

【解决方案1】：

这对我有用

   paper.on('cell:pointerup', () => {
      console.log('Congratulations, you clicked the mouse!');
  });

【讨论】：

【解决方案2】：

JointJS 严重依赖于其他库，例如 jQuery 和 Backbone。在这种情况下，paper.mouseclick() 函数允许您根据 joint.d.ts 定义文件传入一个事件：

mouseclick(evt: Event): void;

使用 Event 作为参数调用它，将触发事件。但是，我假设您实际上对处理事件而不是触发它更感兴趣。在这种情况下，Paper 类扩展了一个 Backbone.View，您可以在其中对其进行如下操作：

let paper = new jointjs.dia.Paper();
paper.on('mouseclick', () => {
  console.log('Congratulations, you clicked the mouse!');
});

希望这就是你要找的。p>

【讨论】：

感谢您的关注，我已经尝试过您的代码，但出现新错误，我已更新问题

【解决方案3】：

我有这个为我工作：

paper.on('blank:pointerclick', function(evt, x, y) {

  //do whatever

}); //end paper.on

【讨论】：