EXTJS 6.7 -标签字段-什么是字段选定项目mouseover、mouseout、selected (不是下拉式项目！)

Question

我需要一些帮助来解决我的问题。我有标签字段与选定的项目。我想知道如何为mouseover、mouseout、selected on items in field，而不是items in dropdown list附加事件)

这只是一个用于测试的标签字段的示例。

Ext.application({
name : 'Fiddle',

launch : function() {
    //Ext.Msg.alert('Fiddle', 'Welcome to Sencha Fiddle!');
    
   var shows = Ext.create('Ext.data.Store', {
    fields: ['id','show'],
    data: [
        {id: 0, show: 'Battlestar Galactica'},
        {id: 1, show: 'Doctor Who'},
        {id: 2, show: 'Farscape'},
        {id: 3, show: 'Firefly'},
        {id: 4, show: 'Star Trek'},
        {id: 5, show: 'Star Wars: Christmas Special'}
    ]
    });
    
    let lbl = Ext.create('Ext.form.Label', {
        text: 'select item'
    });
    
    let win = Ext.create('Ext.window.Window', {
        width:800,
        height: 700,
        modal: true,
        items: [
          
           {
                xtype: 'tagfield',
                fieldLabel: 'Select a Show',
                store: shows,
                displayField: 'show',
                valueField: 'id',
                queryMode: 'local',
                filterPickList: true,
                listConfig: {
                    listeners: {
                        //events for dropdownlist 
                        highlightitem: function() {
                            lbl.setText('highlighted');
                        }
                        
                    }
                }
            },
            lbl
      ]    
    });
    win.show();
    }
});

问候

阿曼多

Answer 1

您可以在itemList上设置监听器

                        afterrender: function () {
                            this.itemList.on({
                                mouseover: {
                                    fn: function () {
                                        alert('mouseover on tag')
                                    },
                                    delegate: 'li.x-tagfield-item',

                                },
                                
                                  mouseout: {
                                    fn: function () {
                                        alert('mouseout on tag')
                                    },
                                    delegate: 'li.x-tagfield-item',

                                }
                            });
                        }

fiddle

附言:谢谢你的小提琴例子)