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？

回答

相關問題