Javascript Sencha Touch 2：在选项卡面板中创建嵌套列表

我已经尝试了上千种不同的方法来实现这一点，Sencha Touch文档远没有清晰或有用，而且每个人似乎都用不同的方法来实现……没有一种方法对我有效

我已成功使列表视图以以下方式工作：

Ext.define("MyApp_eComm.view.Products", {
extend: 'Ext.navigation.View', //Needs to be navigation view to display the     ProductList.js
xtype: 'products',

requires: [
    'Ext.dataview.List',
    'MyApp.view.ProductList',
    'MyApp_eComm.view.ProductDetail'
],

config: {
    title: sMY_CONST_TAB_BROWSE_TITLE,
    iconCls: sMY_CONST_TAB_BROWSE_CLASS,

    styleHtmlContent: true,
    scrollable: true,

    items: [ 
        /*{
            xtype: 'titlebar',
            docked: 'top',
            title: sMY_CONST_TAB_BROWSE_SUBTITLE
        },*/
        {
            xtype: 'productlist',
            title: sMY_CONST_TAB_BROWSE_SUBTITLE
        }
    ]
}  
})

这是我的列表视图，在导航视图中…在选项卡面板中。我使用导航视图的原因是，我可以从披露组件将产品详细信息视图推到顶部

Ext.define("MyApp.view.ProductList", {
extend: 'Ext.List',
xtype: 'productlist',

requires: [
    'MyApp.store.ProductStore'
],

config: {
    itemTpl: '{text}', 
    store: 'ProductStore',
    onItemDisclosure: true 
}
}); 

这是我的模型：

Ext.define('MyApp.model.ProductListModel', {
extend: 'Ext.data.Model', 

config: {
    fields: ['text']
}
}); 

最后，这里是我的存储，其中包含测试数据，目前没有嵌套：

Ext.define('MyApp.store.ProductStore', {
extend: 'Ext.data.Store',

config: {
    model: 'MyApp.model.ProductListModel',
    sorters: 'text',
    data: [
        {
            text: 'Burgers',
        },
        {
            text: 'Pasta',
        },
        {
            text: 'Sausages',
        },
        {
            text: 'Cabbage',
        },
        {
            text: 'Lettuce',
        },
        {
            text: 'Marmalade',
        },
        {
            text: 'Honey',
        },
        {
            text: 'Yogurt',
        },
        {
            text: 'Cheese',
        },
        {
            text: 'Milk',
        },
        {
            text: 'Bread',
        },
        {
            text: 'Butter',
        },
        {
            text: 'Goats Milk',
        },
        {
            text: 'Apple',
        },
        {
            text: 'Oranges',
        },
        {
            text: 'Bananas',
        },
        {
            text: 'Jelly',
        },
        {
            text: 'Spagetti Hoops',
        },
        {
            text: 'Ravioli',
        },
        {
            text: 'Wheatabix',
        },
        {
            text: 'Cornflakes',
        },              

    ]
}
});

加上

config: {
  title: sMY_CONST_TAB_BROWSE_TITLE,
  iconCls: sMY_CONST_TAB_BROWSE_CLASS,

  styleHtmlContent: true,
  scrollable: true,

  items: 
    {
        xtype: 'productlist',
        title: sMY_CONST_TAB_BROWSE_SUBTITLE
    }

}  

---

最好是你为你的问题创建一个Sencha提琴，这样我们可以尝试不同的事情（）。我正在尝试做类似的事情。拥有一个选项卡式应用程序，每个选项卡都有嵌套的深入列表，这是一种非常典型的移动设计模式。为什么他们让它如此难以完成！？没有任何解释？为什么它会比他已经拥有的更好呢？仅仅删除一条评论并不能解决这个问题的作者所遇到的问题。