JointJs - 事件 onConnect Link答案

【问题标题】：JointJs - event onConnect LinkJointJs - 事件 onConnect Link
【发布时间】：2015-01-09 02:24:33
【问题描述】：

我正在尝试创建一个板，用户可以在其中动态添加块并使用链接连接块。（类似于this 但动态）我正在使用 JointJs 框架，到目前为止一切都按预期工作，但是当用户连接两个块时我需要显示一些信息。我的问题是连接块时找不到要处理的事件。

我查看了this question，但在我的示例中，我没有链接实例来附加事件。

Here你可以看我的例子

这是将块添加到板上的方式。 text 属性中的 magnet: true 是使文本可连接的原因。我真的需要一些帮助来找到链接连接时要处理的事件。

 var rect = new joint.shapes.basic.newRect({
     position: { x: position, y: position },
     size: { width: 100, height: 40 },
     attrs: {
         rect: { 'stroke-width': '1',  stroke: 'black', rx: 3, ry: 3, fill: 'blue'},
         text: { text: 'Block', magnet: true,  }
     }
 });
 graph.addCell(rect);

我也查看了 mouseUp 事件和坐标，但一无所获.. 我真的很感谢一些帮助

【问题讨论】：

标签： javascript jointjs

【解决方案1】：

change:source 和 change:target 事件（作为由单元模型触发的所有其他事件）传播到图表，因此您不需要对链接的引用，您可以执行以下操作：

graph.on('change:source change:target', function(link) {
    if (link.get('source').id && link.get('target').id) {
        // both ends of the link are connected.
    }
})

【讨论】：

是否存在避免无目标节点链接的方法？
dave，这只会在连接完全建立时触发，但不会在其一端被切断时触发。当连接建立或丢失时获取事件的正确方法是什么，但如果只是移动了一个开放端（就像change:source 未过滤的情况一样），不是。
您可以在 paper.on('cell:pointerup blank:pointerup', handler) 上做出反应，您可以丢弃所有未设置 source.id 和 target.id 的链接。