JointJS-鼠标单击事件触发单元格位置更改事件 [英] JointJS - Mouse click event triggers cell position change event
本文介绍了JointJS-鼠标单击事件触发单元格位置更改事件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我需要为每个单元格定义鼠标单击事件.我使用了cell:pointerup
事件;但是当我也更改单元格位置时会触发此事件.如何区分这两个事件?
I need to define mouse click event for my each cell. I used cell:pointerup
event; but this event is triggered when I change positions of cells too. How can I differentiate these 2 events?
谢谢.
推荐答案
您可以做的是创建一个自定义元素视图,并通过检查是否触发了pointermove
事件来从拖动中获得不同的点击在pointerdown
和pointerup
事件之间.
What you can do is to create a custom element view and distinct click from dragging by checking whether a pointermove
event was triggered between pointerdown
and pointerup
events.
var ClickableView = joint.dia.ElementView.extend({
pointerdown: function () {
this._click = true;
joint.dia.ElementView.prototype.pointerdown.apply(this, arguments);
},
pointermove: function () {
this._click = false;
joint.dia.ElementView.prototype.pointermove.apply(this, arguments);
},
pointerup: function (evt, x, y) {
if (this._click) {
// triggers an event on the paper and the element itself
this.notify('cell:click', evt, x, y);
} else {
joint.dia.ElementView.prototype.pointerup.apply(this, arguments);
}
}
});
然后告诉joint.dia.Paper
使用该视图.
var paper = new joint.dia.Paper({
// el, width, height etc.
elementView: ClickableView
});
可以在此处找到小提琴.
这篇关于JointJS-鼠标单击事件触发单元格位置更改事件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文