如何在 afterrender 事件 Ext JS 中获取 header 标签元素？

Question

var menuItem1 = new Ext.Panel({
   id: 'panelStart',
   title: 'Start',
   html: 'This is the start page.',
   cls:'menuItem',
   headerCfg: {
      tag: 'div',
      cls: 'title-part'              
      },
    listeners: {
        afterrender: function (comp) {
            var element = comp.getEl();
            element.on('click', function() {
                alert('ok')
            });
        }
    }
});

在这里我们可以轻松访问组件的 dom 节点，但是如何在 afterrender 函数中获取 headerCfg 的 div dom 元素？

Answer 1

ExtJS 4+

面板 header 是 Ext.panel.Header class so you can simply use down() 方法的实例，如下所示：

afterrender: function (panel) {
    var header = panel.down('header'),
        headerElement = header.getEl();
    headerElement.on('click', function () {
        alert('ok');
    });
}

这里是fiddle.

ExtJS 3

你可以使用面板的header 属性，像这样panel.header.getEl()。

如何在 afterrender 事件 Ext JS 中获取 header 标签元素？

How to get header tag element in afterrender event Ext JS?

extjs

extjs3