首页 文章

ExtJS：在执行beforeRender事件时，Ext.form.Panel标头丢失

提问于
浏览 次
0

在ExtJS 4.2中，只要将“beforeRender”事件放入Ext.form.Panel定义中，并创建该定义的实例，面板的 Headers 就会消失 . 有没有办法可以覆盖框架功能，使 Headers （包含我的 Headers 标签）显示出来？不确定这是否有所不同，但我在视口中使用“边框”布局 .

Panel Header (with title) is missing:

Ext.define('App.view.module1.Activity1', {
    extend: 'Ext.form.Panel',
    xtype: 'view-module1-activity1',
    title: 'this header does not show up',
    beforeRender: function() {        
    },    
});

enter image description here

Panel Header (with title) shows up:

Ext.define('App.view.module1.Activity1', {
    extend: 'Ext.form.Panel',
    xtype: 'view-module1-activity1',
    title: 'this header does show up',    
    //beforeRender: function() {        
    //},    
});

enter image description here

我仔细检查了 Headers 是否在那里，但只是隐藏或者它根本不存在 . 这是后者 . 这是渲染 Headers 时div的样子 . 此HTML显示在实际视图div标签下 . 当 Headers 丢失时，由于具有“beforeRender”事件，此HTML块根本不会显示 .

<div class="x-panel-header x-header x-header-horizontal x-docked x-unselectable x-panel-header-default x-horizontal x-panel-header-horizontal x-panel-header-default-horizontal x-top x-panel-header-top x-panel-header-default-top x-docked-top x-panel-header-docked-top x-panel-header-default-docked-top" id="view-module1-activity1-1046_header" style="right: auto; left: 0px; top: 0px; width: 803px;">
    <div id="view-module1-activity1-1046_header-body" class="x-header-body x-panel-header-body x-panel-header-body-default x-panel-header-body-horizontal x-panel-header-body-default-horizontal x-panel-header-body-top x-panel-header-body-default-top x-panel-header-body-docked-top x-panel-header-body-default-docked-top x-box-layout-ct x-panel-header-body-default-horizontal x-panel-header-body-default-top x-panel-header-body-default-docked-top" style="width: 791px;">
        <div id="view-module1-activity1-1046_header-innerCt" class="x-box-inner " role="presentation" style="width: 791px; height: 16px;">
            <div id="view-module1-activity1-1046_header-targetEl" class="x-box-target" style="width: 791px;">

                <div class="x-component x-header-text-container x-panel-header-text-container x-panel-header-text-container-default x-box-item x-component-default" unselectable="on" id="view-module1-activity1-1046_header_hd" style="right: auto; left: 0px; top: 0px; margin: 0px; width: 791px;"><span id="view-module1-activity1-1046_header_hd-textEl" class="x-header-text x-panel-header-text x-panel-header-text-default" unselectable="on">this header does show up</span>
                </div>

            </div>
        </div>
    </div>
</div>
forms extjs header extjs4 render

2 回答

  • 3

    两件事情 . 首先，在函数后面有一个额外的逗号 . 其次， beforeRender 需要 callParent()

    Ext.define('App.view.module1.Activity1', {
    extend: 'Ext.form.Panel',
    xtype: 'view-module1-activity1',
    title: 'this header does not show up',
    beforeRender: function () {
        // code
        this.callParent(arguments);
    }    
});
    回复于
  • -2

    您好，你可以这样做：

    Ext.define('App.view.module1.Activity1', {
extend: 'Ext.form.Panel',
xtype: 'view-module1-activity1',
title: 'this header does not show up',
initComponent: function() {

  // code to run when component is created

  this.callParent(arguments);
},
beforeRender: function () {
    // code

 }    
});
    回复于

相关问题