extjs - Sencha touch 2 - 不能在面板或 TabPanel 内嵌套列表

Question

我正在尝试在 TabPanel 的选项卡内显示一个列表。当我只显示列表时 - 它工作正常，但是当我将它放在 TabPanel 内时它没有显示。

当我在启动事件中使用此代码时会显示它：

Ext.create('Ext.List', {
           fullscreen: true,
           itemTpl: '<div class="contact">{ID} <strong>{Name}</strong></div>',
           store: cityStore
        });

当我使用此代码时，它不会显示（尽管选项卡会根据需要显示）。我也尝试在项目中包含 Ext.create 列表，结果仍然相同。

       Ext.create('Ext.TabPanel',{
            fullscreen: true,
            tabBarPosition: 'bottom',
            scrollable: true,
            items: [
                {
                    title: 'Home',
                    iconCls: 'home',
                    html: ['Welcome to my Pizza!'].join(""),
                    style: 'text-align: center;'
                },
                {
                    title: 'Search',
                    iconCls: 'search',
                    items: [
                          Ext.create('Ext.List', {
                              fullscreen: true,
                              itemTpl: '<div class="contact">{ID} <strong>{Name}</strong></div>',
                              store: cityStore
                          })
                    ]
                },
                {
                    xtype: 'toolbar',
                    title: 'Pizza',
                    dock: 'top'
                }
            ]
        }).setActiveItem(1); // this is set for debugging only

有什么问题？谢谢！

Answer 1

Sencha论坛上解决的问题：

您将列表嵌套在面板中。尝试取消嵌套：

代码：

Ext.create('Ext.tab.Panel',{
    fullscreen: true,
    tabBarPosition: 'bottom',
    scrollable: true,
    items: [
        {
            title: 'Home',
            iconCls: 'home',
            html: ['Welcome to my Pizza!'].join(""),
            style: 'text-align: center;'
        },
        {
            xtype: 'list',
            title: 'Search',
            iconCls: 'search',
            store: cityStore,
            itemTpl: '<div class="contact">{ID} <strong>{Name}</strong></div>'
        },
        {
            xtype: 'toolbar',
            title: 'Pizza',
            dock: 'top'
        }
    ]
}).setActiveItem(1);