有没有办法防止父Konva.Group中的"dragend"事件，当一个孩子被拖动并且子和父都是可拖动的？

Question

我有一个Konva.Group，它是可拖动的。在这个组中，我添加了另一个Konva.group，它有另一个可拖动的Konva.GGroup。所以关系是这样的：

父组->子组->子组

现在，当我试图拖动我的最后一个可拖动的子对象时，我也会在父对象中得到"dragend"事件，尽管父对象保持在同一位置。

所以我只得到这个家长的"dragend"事件。拖动子项可以正常工作，只是父项事件似乎不正确。

到目前为止，我发现的解决方法如下：

let _this = this;
this.on('dragmove', (evt) => {
if(evt.target._id == _this._id){
//my handler code
}
}

但这是一个错误，还是一个预期的行为，我只需要以某种方式防止事件传播？

Answer 1

这不是一个bug。这是事件冒泡(事件传播(的预期行为。它适用于所有拖动事件。

有两种方法可以解决这个问题。

(1( 取消事件气泡

https://konvajs.org/docs/events/Cancel_Propagation.html

childGroup.on('dragend', (e) => {
evt.cancelBubble = true;
});

(2( 在事件中筛选

这就是你在变通方法中所做的。e.target指向被拖动的节点。因此，您可以使用它来检查事件回调的逻辑。

parentGroup.on('dragend', (e) => {
// do nothing if any child was dragged
if (e.target !== parentGroup) {
return;
}
// do some logic here
});