ExtJS 6.02 - 是否可以将一个mouseleave事件附加到Ext.menu.Item？

当用户的光标离开Ext.menu.Item（通过鼠标滑过菜单下拉菜单）时，我想从最后一次鼠标悬停的菜单项中删除'x-menu-item-active'类。ExtJS 6.02 - 是否可以将一个mouseleave事件附加到Ext.menu.Item？

目前这不会在Ext 6.0.2中自动发生，即当用户从Ext.menu中移出时，用户悬停的最后一个菜单项仍包含'x-menu-item-active'类。

目前我实现这个是这样的：

Ext.define('MyApp.someController', { 

    init: function() { 
     var me = this; 

     me.control({ 

      '#idOfMyMenu': { 
        mouseleave: me.onMouseLeave 
      } 
     }); 

    }, 

    onMouseLeave: function(target) { 
     var me = this, 
      activeCls = 'x-menu-item-active', 
      menuItems = target.items; 

     Ext.each(menuItems, function(item) { 
      if (item.hasCls(activeCls)) { 
       item.removeCls(activeCls); 
      } 
     } 

    } 
}

然而，这需要遍历在我的下拉菜单中的所有菜单项，每次用户鼠标移出。无论如何，我可以将一个'mouseleave'侦听器附加到Ext.menu.Item中，以便我不需要遍历所有菜单项？

Ext.menu.Item类只包含'blur'，'focusleave'事件，它们不允许我做我想做的事。

来源

2016-12-01 Kevin Lee

你不能避免循环，但可以将其隐藏的DOM API的背后，如果你认为它看起来更清洁......

onMouseLeave: function(menu, ev){ 
    Ext.fly(ev.getTarget()) 
     .down('.x-menu-item-active') 
     .removeCls('x-menu-item-active'); 
}

» Fiddle

否则有对OUT-没有鼠标事件现成的Ext菜单项，您必须实现自己的自定义组件。

来源

2016-12-05 11:18:34 Emissary

ExtJS 6.02 - 是否可以将一个mouseleave事件附加到Ext.menu.Item？

回答

相关问题