Extjs создают динамический аккордеон с помощью магазина
Я начинаю разработку приложения в extjs. Я'м с использованием подхода MVC, как предусмотрено вдокументация extjs.
У меня есть некоторые динамические данные, которые должны предоставить пользователю набор элементов управления аккордеоном. Я'У меня есть данные в магазине, но я не знаю, как динамически создавать элементы аккордеона (в отличие от панелей сетки,кажется, что это метод хранения данных).
Вот мой текущий код представления аккордеона - со статическими элементами:
Ext.define('BP.view.induction.LeftPage', {
extend: 'Ext.Panel',
alias : 'widget.leftpage',
title: "Left Page",
layout: {
type: 'accordion',
align: 'stretch'
},
layoutConfig: {
// layout-specific configs go here
titleCollapse: true,
animate: true,
activeOnTop: true
},
items: [{
xtype: 'panel', // fake hidden panel, so all appear collapsed
hidden: true,
collapsed: false
},{
xtype: 'panel',
title: 'Panel 1',
html: 'Panel content!'
},{
xtype: 'panel',
title: 'Panel 2',
html: 'Panel content!'
},{
xtype: 'panel',
title: 'Panel 3',
html: 'Panel content!'
}]
});
Спасибо за любые рекомендации о том, как достичь вышеизложенного.
[Править] В ответ на сраs запрос, вот мой контроллер:
Ext.define('BP.controller.Induction', {
extend: 'Ext.app.Controller',
views: [
'induction.Binder'
],
stores: [
'Sections',
'Categories',
'Tasks'
],
init: function() {
console.log('Initialized Induction!');
}
});
Я должен отметить, что этот контроллер загружает родительское представление, которое, в свою очередь, загружает представление LeftPage - I 'Я не уверен, что это создает какие-либо проблемы с областями видимости. Кроме того, как видите, загружено более одного магазина.