Sencha Touch tabPanel с использованием динамических данных JSON - PullRequest
Новая
       38

Sencha Touch tabPanel с использованием динамических данных JSON

2 голосов
/ 29 сентября 2011

В моем приложении первая страница показывает вкладку внизу. Но количество вкладок, их ярлыки и значки - это динамическое содержимое, полученное по запросу json. Мне интересно, как это сделать. Вот что я попробовал. 

TMDemo = new Ext.Application({
name: 'TMDemo',
launch: function(){
    this.views.mainTabBar = new this.views.MainTabBar();

}

}); 

TMDemo.views.MainTabBar = Ext.extend(Ext.TabPanel,{
fullscreen: true,
 tabBar:{
    dock:'bottom',
    layout:{
        pack:'center'
    }
 },
 addItems: function(){
        this.add(addItemsBasedOnJsonData());
        this.doLayout(); // important
},
listeners: {
    beforerender:function(){
        Ext.util.JSONP.request({
        url: 'app/data/tabbar.json',
        callbackKey: 'callback',
        callback: function(result) {
         console.log("Inside callback");    
         TMDemo.tabBarData = result;                              
        }
    });
}
    render: function(){
        console.log("Inside render");
        this.addItems();
    }
}

});

Здесь данные панели вкладок берутся из tabbar.json (фиктивными данными будут некоторые URL). Я добавляю элементы в эту панель вкладок с помощью функции addItemsBasedOnJsonData (), которая создает элементы вкладки и возвращает массив. Но проблема в том, что событие рендера всегда запускается первым, а затем обратным вызовом JSON-запроса, поэтому jsondata для динамического создания вкладок недоступен. Пожалуйста, ведите меня в правильном направлении. Прав ли этот подход. Могу ли я найти какой-нибудь пример.

Tarun

1 Ответ

0 голосов
/ 29 сентября 2011

Вы пробовали это: 

callback: function(result) {
         console.log("Inside callback");    
         TMDemo.tabBarData = result;
         TMDemo.views.mainTabBar.add(TMDemo.views.mainTabBar.addItemsBasedOnJsonData());

 }
...