javascript - 当工具栏存在时，Ext js FormPanel 不显示面板项目

Question

我似乎遇到了一个奇怪的问题。扩展组件具有以下代码:

MyApp.panels.RelationshipDetails = Ext.extend(Ext.FormPanel, {
    closable: true,
    relationshipId: null,
    documentId: null,
    title: 'Relationship',
    initComponent: function () {
        if (!this.verifyRequiredData()) {
            MyApp.panels.RelationshipDetails.superclass.initComponent.call(this);
            return;
        }

        // Build components
        this.tbar = this.buildToolbar();
        this.items = this.buildDetailItemArray();

        MyApp.panels.RelationshipDetails.superclass.initComponent.call(this);
    },

    verifyRequiredData: function () {
        // Verification code here
    },

    buildDetailItemArray: function () {
        return [{
            xtype: 'fieldset',
            title: 'Details',
            collapsible: true,
            autoHeight: true,
            items: [{
                xtype: 'hidden',
                name: 'Id'
            }, {
                xtype: 'textfield',
                fieldLabel: 'Name',
                name: 'Name'
            }, {
                xtype: 'textfield',
                fieldLabel: 'Description',
                name: 'Description'
            }, {
                xtype: 'button',
                text: 'Save',
                name: 'saveButton'
            }]
        }];
    },

    buildToolbar: function () {
        return new Ext.Toolbar({
            // Toolbar Config
        });
    }
});

问题是，当此面板呈现时，工具栏是唯一呈现的东西。通过调试，我可以看到 BuildDetailItemArray() 被正确调用并返回正确的结果。

当我注释掉 this.tbar = 行时，情况变得更加奇怪，因为当工具栏不存在时，字段集和字段会正确呈现。即使我扩展 Panel 而不是 FormPanel，也会发生这种情况。我还尝试将表单字段抽象到它自己的组件中，并且发生了同样的事情。

有人知道为什么这似乎不起作用吗？

Answer 1

您想将此面板放入哪种布局？另外，您是否设置了该面板的高度？

通常，如果您没有指定要添加的组件的高度(在您的例子中是此面板)，或者如果使用 AnchorLayout，则没有设置 anchor ，则不会显示组件内容，但是工具栏仍然会。

最好了解该面板在整体布局中的上下文。