Sencha Touch 2: создание вложенного списка внутри панели вкладок

Question

Я попытался сделать это тысячу разных способов, документация 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', 
     },    

    ] 
} 
}); 

Answer 1

пытаются добавить так

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 
    } 

}