2

我将以下组件添加到面板中。当我将布局设置为边框时，不会渲染孩子。但是，如果我将布局更改为其他（例如 hbox、vbox、auto），它会起作用。

你能建议我做错什么吗？我正在使用 ExtJS 4.1.3

Ext.define('WebAdmin.view.reference.CountryMain', {
    extend        : 'Ext.container.Container',
    alias         : 'widget.country.main',
    requires      : ['Ext.layout.container.Border',
                 'Ext.resizer.BorderSplitter'],
    layout        : {
        type        :'border'   // does not work
    },
    initComponent : function() {
        var me = this;
        me.items = [{
            region      : 'center',
            layout      : 'fit',
            html        : 'Center'
        },{
            region      : 'east',
            html        : 'East',
            width       : 300,
            split       : true,
            collapsible : true
        }];
        me.callParent();
    }
});

我已经关注了为什么我的 ExtJS 选项卡不会显示带有边框布局的项目但无法解决我的问题。

4

1 回答 1

1

问题可能是您没有为容器指定宽度/高度。这可以在配置中显式完成，也可以通过确保父容器使用布局（不仅仅是默认布局，它不会调整大小）来完成。

在这个例子中，我将你的组件添加到正文中，给它一个硬编码的宽度/高度http://jsfiddle.net/StK2Y/这有效

Ext.create('WebAdmin.view.reference.CountryMain', {
    title: 'Border Layout',
    renderTo: Ext.getBody(),
    width: 500,
    height: 500    
});

但是，如果父容器没有设置宽度/高度，边框布局将不起作用http://jsfiddle.net/StK2Y/1/

Ext.create('WebAdmin.view.reference.CountryMain', {
    title: 'Border Layout',
    renderTo: Ext.getBody()
});
于 2013-02-20T00:40:47.137 回答