Erreiche Hauptansichtsfenster von Controller

Question

Ich erstellte ein Viewport in meiner Startfunktion der Anwendung. Im Controller unten lösche ich zuerst ein Fenster und dann möchte ich meine benutzerdefinierte Klasse zum Hauptfenster hinzufügen. Hier ist der Code

Ext.define('MyApp.view.login.LoginController', { 
    extend: 'Ext.app.ViewController', 
    alias: 'controller.login', 

    onLoginClick: function() { 


     localStorage.setItem("TutorialLoggedIn", true); 


     // Now, we are free to remove the login window. 
     this.getView().destroy(); // this is Window class 

     // ========================================== 
     // *** Here I want to add main view to main viewport. How? 
     Ext.create("MyApp.view.main.Main", {renderTo: /*How to get handle to main viewport?*/}); 

    } 
}); 

Ich möchte Main Ansicht hinzufügen, um Ansichtsfenster aber ich nicht Bezug auf die Hauptansichtsfenster erhalten.

Wie kann ich das erreichen?

---

Dies ist, wie ich Ansichtsfenster in meinem Start erstellt:

launch: function() { 

     // 
     // Create viewport for the application 
     // 
     var myViewPort = Ext.create('Ext.container.Viewport', { 
      layout: 'fit', 
      html: 'Main application', 
      xtype:'viewport' 
     }); 

Answer 1

Dies ist meine aktuelle Lösung ist. Was ist deine Meinung?

onLoginClick: function() { 


     localStorage.setItem("TutorialLoggedIn", true); 


     // Now, we are free to remove the login window. 
     this.getView().destroy(); 


     // Create main view 
     var panel = Ext.create("MyApp.view.main.Main"); 
     globalVar.vp.add(panel); 
    } 

Wo globalVar.vp in app.js globale Objekt ist, die sich auf Ansichtsfenster hält.

Btw ähnlich oben, als ich Main erstellen und globalVar.vp als renderTo Parameter angegeben wurde es funktionierte nicht warum?

---

Hier ist, wie die globale

erstellt

var globalVar = { vp : ""}; 


Ext.application({ 
     name: 'MyApp', 
     appFolder:"app", 

     // List views needed 
     views: [ 
      'MyApp.view.login.Login', 
      'MyApp.view.main.Main' 
     ], 

     requires: ["Ext.container.Viewport"], 

     launch: function() { 

       // 
       // Create viewport for the application 
       // 
       var myViewPort = Ext.create('Ext.container.Viewport', { 
        layout: 'fit', 
        html: 'Main application', 
       }); 

       // Store handle to viewport - to refer to it later from somewhere else 
       globalVar.vp = myViewPort; 

Answer 2

Sie id erstellt Ansichtsfenster geben kann, und verwenden Sie es innerhalb Darstellungshauptansicht zu setzen.

Answer 3

Wenn Sie nur den Viewport zugreifen möchten, um dann in der Steuerung,

this.getView().up('viewport') 

wird die Referenz auf das Ansichtsfenster zurückzukehren