sencha touch 2 оптимизация

Question

Прилагается файл моего контроллера .. я в основном хочу переключать представления .. добавление и удаление панели в контейнере с 2 кнопками .. в методе для дома и популярной кнопки я использую Ext.create снова и снова не будет перегружать мое приложение becoz iam, не разрушая мои представления iam, добавляя и удаляя их. Мой главный вопрос: как я могу создать глобальный var для этой ситуации, как я создаю var homepanel = Ext.create только один раз и то я могу повторно использовать этот вар, когда я хочу, чтобы удалить или добавить его из моей mainContainer .. нужны серьезные рекомендации по этому вопросу .. обыскал всю, но я справку о не имею никакого понятия об этом

Ext.define('app.controller.MainController', { 
extend: 'Ext.app.Controller', 

config: { 
    refs: { 
     homeBtn: '#homeBtn', 
     popularBtn: '#popularBtn', 

     homePanel: '#homePanel', 
     mainContainer: '#mainContainer' 
    }, 
    control: { 
     homeBtn:{ 
      tap: 'homeBtnAction' 
     }, 
     popularBtn:{ 
      tap: 'popularBtnAction' 
     } 
    } 
}, 


launch: function(app) { 
    this.callParent(arguments); 

    console.log("main launched"); 

    var mainCont = this.getMainContainer(); 
    var homepanel = Ext.create('app.view.Home.HomePanel'); 

    mainCont.add(homepanel); 

    console.log("homePanelAdded"); 
}, 

homeBtnAction: function(){ 
    console.log("home page called"); 

    var mainCont = this.getMainContainer(); 
    var homepanel = Ext.create('app.view.Home.HomePanel'); 
    var popularpanel = Ext.create('app.view.Popular.PopularPanel'); 

    mainCont.remove(popularpanel); 
    mainCont.add(homepanel); 
}, 

popularBtnAction: function(){ 
    console.log("popular page called"); 

    var mainCont = this.getMainContainer(); 
    var homepanel = Ext.create('app.view.Home.HomePanel'); 
    var popularpanel = Ext.create('app.view.Popular.PopularPanel'); 

    mainCont.remove(homepanel); 
    mainCont.add(popularpanel); 
} 
}); 

ПРИМЕЧАНИЕ: Iam использует Ext.define для создания моих представлений и использования структуры MVC.

Answer 1

Используйте это,

var homepanel = this.getHomePanel() || Ext.create('app.view.Home.HomePanel'); 

если this.getHomePanel() не возвращает ничего, это будет создавать панель для вас. После этого вы будете использовать уже созданную панель.

Другое примечание: если вы не манипулируете кнопками каким-либо образом, нет необходимости указывать им идентификатор или ссылку.

Настройте кнопку на ваш взгляд, как так

{ 
xtype : 'button', 
text : 'Home Panel', 
action : 'goHome' 
} 

затем в блоке управления вашего использования контроллера это

'button[action=goHome] : 
{ 
    tap: 'homeBtnAction' 
} 

Answer 2

Один из вариантов: в «запуске» вы создаете оба вида (с помощью Ext.Create) и используете Ext.getCmp в обратных вызовах кнопки действий для извлечения ранее созданных представлений.