时间戳

首页 > 解决方案 > Ext JS：无法在容器中放置网格面板

extjs - Ext JS：无法在容器中放置网格面板

问题描述

我无法在容器中放置网格面板。这是我的布局示例。请忽略任何左大括号或右大括号，我想给出我设计的高级布局结构。

问题：在这里，在示例中，即第三个容器中，我无法在其中放置面板和网格。当我删除网格时，布局工作正常，当我放置网格时，所有布局看起来都是空白的，我也看不到其他组件，我也没有收到任何控制台错误。我什至尝试为容器提供固定的宽度和高度。问题在于组件的布局和显示。

任何建议都受到高度赞赏。

extend: 'Ext.form.Panel',
items: [{
            xtype: 'container',
            layout: 'vbox',
            items: [{
               xtype: 'container',
               layout: 'hbox',
               items: [{-----}]
            },{
               xtype: 'container',
               layout: 'hbox',
               items: {
                       xtype: 'panel',
                       title: 'Hours of Operation',
                        itemId: 'hoursOfOperationPanel',
                        items: {
                           xtype: 'grid',
                           store: hoursStore,
                        }
                 },
            },{
               xtype: 'container',
               layout: 'hbox',
               items: [{-----}]               
            }]
      }]

标签： extjs

解决方案

除了在容器中使用容器外，您还可以尝试如下所述，将项目包含在容器中并将它们定义为默认布局。您可以清楚地找到某一级别的元素及其对应的子元素。

Ext.apply(me, {
        items: [{
            xtype: 'container',
            layout: 'vbox',
            defaults: {
                layout: 'hbox',
                flex: 1,
                width: '100%',
                defaults: {
                    height: '100%'
                }
            },
            items: [{
                items: [{

                }]
            },{
                items: [{

                }]
            }]
        }],
});

推荐阅读