Rozpoczynam tworzenie aplikacji w extjs. Używam podejścia MVC, jak podano w extjs documentation.Extjs stwórz dynamiczny akordeon za pomocą sklepu
Mam pewne dynamiczne dane, które muszą przedstawiać użytkownikowi zestaw kontroli akordeonu. Mam dane w sklepie, ale nie wiem, jak dynamicznie tworzyć elementy akordeonu (w przeciwieństwie do paneli gridowych, nie wydaje się, że jest to metoda danych sklepu).
Tu jest mój bieżący kod widok akordeon - z elementów statycznych:
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!'
}]
});
Wszelkie wskazówki, w jaki sposób osiągnąć powyższe byłoby mile widziane, dziękuję.
[Edit] W odpowiedzi na żądanie SRA, oto jest mój kontroler:
Ext.define('BP.controller.Induction', {
extend: 'Ext.app.Controller',
views: [
'induction.Binder'
],
stores: [
'Sections',
'Categories',
'Tasks'
],
init: function() {
console.log('Initialized Induction!');
}
});
Należy zauważyć tutaj, że ten regulator ładuje widok rodzica, który z kolei ładuje pogląd LeftPage - Nie jestem pewien, jeśli spowoduje to problemy z określaniem zakresu. Ponadto, jak widać, załadowano więcej niż jeden sklep.
Dzięki za pomoc sra. Dodałem kod i zmieniłem ten wiersz: 'me.sections.each (addItem);' i ładuję magazyn używając parametru 'stores' w kontrolerze, ale mówi mi, że jest niezdefiniowany. Jestem pewien, że jest to dość oczywiste, ale jako początkujący programista wciąż walczę z podstawami. Każda pomoc, jaką możesz zaoferować, zostanie bardzo doceniona. – BrynJ
@BrynJ Cóż, myślę, że od razu jest to proste; twórz instancję '' BP.view.induction.LeftPage'' używając 'Ext.create ('BP.view.induction.LeftPage', {store: yourStoreVariable});' zamiast 'Ext.widget()'. Jeśli to nie pomoże, proszę zrzucić funkcję kontrolera w miejscu, w którym tworzysz tę klasę, a ja zobaczę, co mogę zrobić. – sra
Jestem pewien, że jest to oczywiste, ale nie dla mnie :) Dodałem mój kod kontrolera do pytania, a także kilka szczegółów poniżej. – BrynJ