Question

出于某种原因，当下面的浮动面板失去焦点时，模糊事件不会被触发。但是，当我听到＆＃39; el＆＃39; el对于blur事件的面板，它会被注册，如侦听器配置中所示。我想要做的是在模糊事件发生时隐藏面板。如何访问父面板？

Ext.define('NoteKeeper.view.tabs.AttachmentPanel',{
    extend : 'Ext.panel.Panel',
    alias : 'widget.attachmentPanel',
    itemId : 'attachmentPanel',
    floating : true,
    focusable : true,
    width : 200,
    height : 150,
    layout : {
        type : 'vbox'
    },
    items : [
        {
            xtype : 'grid',
            store : null,
            columns : [
                {
                    text : 'File Name',
                    dataIndex : 'fileName'
                },
                {
                    dataIndex : 'remove'
                }
            ]
        },
        {
            xtype : 'button',
            text : '+'
        }
    ],
    listeners : {
        el: {
            blur: {
                fn: function()
                {
                    console.log( this );
                    //how do I access the 'attachmentPanel' from here 
                    //so I can hide it ?
                }
            }
        }
    },
    noteId : null,
    initComponent : function()
    {
        this.callParent(arguments);
    }
});

请注意，这些附件可以有多个实例。

Answer 1

以下似乎可行：

listeners : {
        el: {
            blur: {
                fn: function()
                {
                    console.log(this);
                    var elId = this.id;
                    var attachmentPanels = Ext.ComponentQuery.query('#attachmentPanel');
                    Ext.Array.forEach( attachmentPanels, function(cmp){
                        if(cmp.id == elId)
                        {
                            cmp.hide();
                            return false;
                        }
                    });
                }
            }
        }

如果有更好/更有效的解决方案，请告诉我。谢谢！

Answer 2

从元素到拥有组件的引用，以component属性的形式，因此从元素的范围，您可以像这样访问面板：

var attachmentPanel = this.component;

如何访问父组件ExtJS？

2 个答案: