javascript - ExtJS Ext.panel.body 未定义.. 为什么？

Question

我创建了一个带有几个选项卡的选项卡面板，当我尝试实现甘特图(需要 dom 来创建)时，我一直看到 panel.body 是未定义的，即使我向面板添加了一些东西......

...},{
title: "Descriptions View",
id: 'dviewTab',
iconCls: 'icon-desc',
autoWidth: true,
forceLayout: true,
header: false,
xtype: 'panel',
items: [ {xtype: 'textfield', value: 'testing'} ] // so we have something in the 'body'
},{....}

然后在创建面板后我做

    var uiPanel = Ext.getCmp('dviewTab');
    if (uiPanel.body)
    {
       // never gets here :(
    } // if
    else
    {
        this.logger("uiPanel.body is undefined.... WHY??");
    }

我可以在 firebug 中看到面板，看起来应该是这样，但我没有看到 body 字段，如果这与面板的“元素”值相关，则面板的“元素”值为“body”。我不明白为什么它是未定义的，请帮忙。

Answer 1

您需要等到面板渲染完成。

var myPanel = new Ext.Panel({});
console.log("`myPanel.body` is "+myPanel.body); // "`myPanel.body` is undefined"

myPanel.on('render', function() {
    console.log("`myPanel.body` is "+myPanel.body); // "`myPanel.body` is [object Object]"
});

var container = Ext.getCmp("ext-comp-123");
container.add(myPanel);
container.doLayout();