除非我打开Firebug,否则ExtJS面板无法正常渲染？

Question

我将以下ExtJS Panel嵌入另一个Panel中,然后它位于TabPanel中,TabPanel位于FormPanel中.

话虽如此,这些开始/结束日期字段最初显示在非常小的单元格中 - 单元格太小,我看到水平滚动条.现在这里是奇怪的部分:如果我打开Firebug,一切都会到位.

有谁知道发生了什么？为什么它首先没有正确呈现？为什么Firebug只需打开Firebug就能使一切正常工作？

var dateFields = new Ext.Panel({
    id: 'dateFields',
    labelAlign: 'bottom',
    border: false,
    items: [{
        layout: 'column',
        defaults: {
            columnWidth: 0.5
        },
        items: [{
            layout: 'form',
            border: false,
            items: [{
                xtype: 'datefield',
                name: 'start_date',
                fieldLabel: 'Start Date'
            }]
        }, {
            layout: 'form',
            border: false,
            items: [{
                xtype: 'datefield',
                name: 'end_date',
                fieldLabel: 'End Date'
            }]                  
        }]
    }]
});

Answer 1

我以前见过这个问题...您可能需要做三件事。

1. 如果包含日期字段面板的父面板是 FormPanel，则设置deferredRender : true
2. 在选项卡面板上，设置layoutOnTabChange: true <--我猜日期字段面板不是默认的活动面板，对吗？
3. 在上面的代码中，给 datefields Panel 一个布局： 'fit"。这样它就可以更好地管理具有列布局的面板