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

Question

我正在尝试在 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：意外的令牌。需要构造函数、方法、访问器或属性。

如何使用打字稿为矩形和线条添加事件处理程序？

Answer 1

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

mouseclick(evt: Event): void;

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

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

希望这就是您要找的。

Answer 2

这对我有用

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

Answer 3

我有这个为我工作：

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

  //do whatever

}); //end paper.on

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

JointJS event handler in typescript

typescript

jointjs