聚合物:阻止儿童切换鼠标输入/输出事件

时间:2016-07-25 16:05:21

标签: javascript javascript-events polymer

我有一个Polymer组件,其中包含on-mouseenteron-mouseout的听众。

listeners: {
    mouseenter: 'mouseEnter',
    mouseout: 'mouseOut',
}

mouseEnter: function (e) {
    console.log('\n\nENTER');
    this.$.deleteBtn.style.display = 'block';
},

mouseOut: function (e) {
    console.log('\n\nOUT');
    this.$.deleteBtn.style.display = 'none';
}

其中包含多个其他元素。

问题是,事件触发所有子元素而不仅是父容器。特别是mouseout似乎多次触发。 我只希望在主机进入或退出时触发它们,而不是所有个别孩子。否则会导致各种意外行为。

如果我没有使用Polymer侦听器,这可以解决,但是因为我希望保持一致并具有适当的范围,所以这不是一个真正的选择。 我错过了什么?

1 个答案:

答案 0 :(得分:0)

您应该使用mouseleave而不是mouseout,因为会为每个子元素触发mouseout

有关详细信息,请参阅herehere