边框布局内的边框布局

Question

我正在尝试将3个面板（北，中和南）放置在我的西面板内，以便可以在其中放置物品。 有什么帮助吗？

Ext.onReady(function(){

    north_panel = Ext.create('Ext.form.Panel', {
        region :'north', 
        height : '10%',
        items : [] 
    });

    west_panel = Ext.create('Ext.form.Panel', {
        region :'west', 
        width: '40%',
        items : [] 
    });

    center_panel = Ext.create('Ext.form.Panel', {
        region :'center', 
        items : [] 
    });



    viewport = Ext.create('Ext.container.Viewport', {
        layout : 'border' ,
        renderTo :'document.body',
        items : [north_panel , west_panel , center_panel]
    });

});

Answer 1

只需执行与您已经做过的相同的操作即可。 在您的西面板内部声明一个布局边框，并在其中添加3个面板，并根据需要添加“区域”配置。

{
     xtype : 'panel',
     html : 'West Panel',
     region :'west',
     layout : 'border',
     width: 200,
     items :[{
               xtype : 'panel',
               html : 'North Panel 2',
               region :'north'
             }, {
               xtype : 'panel',
               html : 'South Panel',
               region :'south'
             }, {
               xtype : 'panel',
               html : 'Center Panel 2',
               region :'center'
            }]
}

这是一个工作的小提琴： http : //jsfiddle.net/Xpe9V/1612/

希望它有帮助:)