如何将面板添加到 extjs 选项卡

Question

>我试图将面板添加到选项卡面板的选项卡中（如下所示）但我在控制台中得到"布局运行失败"

任何指针或一般如何向选项卡添加组件因为我在选项卡中看到的示例只是HTML

谢谢。

{
                            xtype: 'tabpanel',
                            activeTab: 0,
                            width: 632,
                            //height: 300,
                            items: [
                                {
                                    title: 'Companies',
                                    layout: 'border',
                                    items: [
                                        {
                                            xtype: 'panel',
                                            region: 'center',
                                            width: 500,
                                            title: 'Tooler',
                                            items: []
                                        },
                                        {
                                            xtype: 'toolbar',
                                            region: 'south',
                                            width: 500,
                                            items: [
                                                '->',
                                                { text: 'Edit Company', action: 'edit' }
                                            ]//toolbar items
                                        }
                                    ]
                                },
                                {
                                    title: 'Access Group'
                                },
                                {
                                    title: 'Roles'
                                },
                                {
                                    title: 'Menus'
                                },
                                {
                                    title: 'Forms'
                                }
                            ]
                        }

Answer 1

尝试类似以下内容：

{
  xtype:'tabpanel',
  activeTab: 0,
  width: 632,
  height: 300,
  /*
  * -or- instead of specifying height/width,
  * depending on the parent container use a
  * layout e.g. layout:'fit'
  *
  */
  items:[
    {
       xtype:'panel'
       title'tab1',
       /*
       * again, try, e.g. layout:'fit',
       * also note you should put the toolbar here
       * using, e.g. tbar: Ext.create('Ext.toolbar.Toolbar, {properties, items...}),
       *
       */
       items:[
              ...etc....
       ]
    },
    {
       xtype:'panel'
       title'tab2',
       // again, try, e.g. layout:'fit',
       items:[
              ...etc....
       ]
    }
  ]
}

一般逻辑是 - 创建一个tabpanel，每个选项卡都是该选项卡面板的一个项目（panel），其title文本成为选项卡文本。然后，您可以根据需要显示的内容设置每个子面板的内容，方法是定义其html，或者在其items属性下向其添加更多子items。

如果可能，不应将工具栏指定为项，而应使用工具栏所针对的组件的 tbar 属性进行定义。如果希望工具栏显示在面板的底部而不是顶部，请将其指定为相同，但使用 bbar 属性而不是 tbar 。