Sencha Touch : 로그 아웃시 패널 파괴

Question

사용자가 로그 아웃 할 때 "Main.js"인 로그인 페이지와 "My Data"와 같은 하위 뷰가있는 패널을 모두 제거해야합니다. 아래에서 볼 수 있듯이 올바른 저장소 데이터가로드되고 이전 데이터가 표시되지 않도록하려는 것입니다.

그러나이 방법과 사용자가 로그 아웃 할 때 저장소를 언로드하거나보기를 제거하는 최상의 방법에 대해서는 잘 모릅니다.

사용자 로그 아웃을 처리하는 가장 좋은 방법은 무엇입니까?

Main.js

Ext.define('app.view.Main', { 

extend: 'Ext.tab.Panel', 

xtype: 'main', 

requires: [ 
    'app.view.TeacherPanel', 
    'app.view.ParentPanel', 
    'app.view.AboutPanel', 
    'app.view.user.Profile' 
], 

config: { 

    tabBarPosition: 'bottom', 

}, 

initialize: function() { 

    console.log('main.initialize'); 

    this.callParent(arguments); 

    // add data panel 
    var dataPanel = { 
     title: 'My Data', 
     iconCls: 'home', 
     xtype: eMaliApp.services.App.getActivePanel() 
     store: 'somestore' // i want this to be reloaded 
    }; 
    this.add(dataPanel); 

    // add user panel 
    var profilePanel = { 
     title: 'Profile', 
     iconCls: 'user', 
     xtype: 'userprofile' 
    }; 
    this.add(profilePanel); 

    // add about panel 
    var aboutPanel = { 
     title: 'About', 
     iconCls: 'info', 
     xtype: 'aboutpanel' 
    }; 
    this.add(aboutPanel); 

    // Load general app data 
    app.services.Store.loadSomeStores(); 
} 

});

Profile.js

onLogoutTap: function(e) { 
    Ext.Ajax.request({ 
     url: 'session/mobileLogout', 
     method: 'POST', 
     useDefaultXhrHeader: false, 
     withCredentials: true, 
     callback: function(options, success, response) { 
      if (!success) { 
       console.log('Logout failed, redirecting to login page anyway'); 
      } 
      //Ext.getCmp('main').destroy(); // should be so 
      Ext.Viewport.removeAll(true, true); // does not remove main 
      Ext.Viewport.add(Ext.create('app.view.LoginPanel')); 
     } 
    }); 
} 

Answer 1

보통 나는 (이 애니메이션 걸리는 시간)은 500ms 후, 현재보기를 파괴 비활성화

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

config: { 
    refs: { 
     view: '.whatever your view is comes here. Take a look at autocreate.' 
    }, 
    control: { 
     view: { 
      deactivate: 'onViewDeactivate' 
     } 
    } 
}, 

onViewDeactivate: function (view) { 
    Ext.defer(function() { 
     view.destroy(); 
    }, 500); 
}, 

이 모든 뷰를 파괴한다. 좋은 일은 당신이 이것을하는 곳을 가지고 있습니다.

그러나 다시 예 :

var items = Ext.Viewport.getItems(); 

는 이제 모든 항목을 반복하고 그들을 파괴.