ExtJS 4 MVCデスクトップ - プログラムでモジュールを作成/開く方法

Question

私は、すぐに利用できるExtJSデスクトップの例と非常によく似た、働くWebデスクトップアプリケーションを持っています。そこにはいくつかのアイコンがあります、ウィンドウを生成する。

私はプログラム的に同じことを行う方法を把握しようとしています：

var b = this.app.getDesktop(); 

このライン爆弾：

var x = Ext.create('MyApp.view.users.Module') 
x.launcher.handler(); 

これは最初の行そのうちのcreateWindow（）関数を呼び出します。

は未定義

の 'はgetDesktop' メソッドを呼び出すことはできません

これは明らかに "this"に "app"がないことを意味します。

私はExtJSの初心者で、モジュールをアプリケーションに結びつける方法や、アイコンをクリックする方法を正しく把握する方法がわかりません。どんな助けもありがとう。

モジュールコード：

Ext.define('MyApp.view.users.Module', { 

requires:      ["Ext.tab.Panel"], 
alias:      'widget.usersmodule', 
extend:      'Ext.ux.desktop.Module', 
id:       'users-module-win', 
itemId:      'usersmodule', 

init:       function(){ 
    this.launcher = { 
     handler:    this.createWindow, 
     iconCls:    'icon-users', 
     scope:     this, 
     text:     'Users', 
     windowId:    'users-module-win' 
    } 
}, 

... 

createWindow:     function(){ 
    var b = this.app.getDesktop(); 
    var a = b.getWindow('users-module-win'); 

    ... 

    a.show(); 
    return a 
}, 

... 

}）。

Answer 1

私はこの問題を解決する方法を見つけました。

私は、アプリケーション作成の一部として私のデスクトップアプリケーションを作成するときに、私はそのアクションの結果にグローバル変数を設定します。

var _myDesktopApp; 

Ext.application({ 

appFolder:'MyApp', 

controllers:[ 
    .... 
], 

name:'MyApp', 

launch:function() { 

     Ext.Loader.setPath({ 
      .... 
     }); 

     Ext.require('MyDesktop.App'); 
     Ext.require('Ext.tab.*'); 

     Ext.onReady(function() { 
      _myDesktopApp = Ext.create('MyDesktop.App'); 
     }); 
    }; 
} 

}）;

その後、私のデスクトップファイルで、私は特定のモジュールを得ることができますし、いくつかの初期サイズの設定でそれを開きます。

Ext.define("MyDesktop.App", { 
extend:      "Ext.ux.desktop.App", 
requires:     [ 
    "Ext.window.MessageBox", 
    "Ext.ux.desktop.ShortcutModel", 

    "MyApp.view.prospects.Module",   
    "MyApp.view.users.Module" 
], 
init:      function() { 
    this.callParent(); 

    var prospects_width = 700; 
    var prospects_height = 500; 
    var prospects_x = 0; 
    var prospects_y = 0; 
    _myDesktopApp.getModule('prospects-module-window').createWindow(prospects_width, prospects_height, prospects_x, prospects_y); 

    var users_width = 700; 
    var users_height = 500; 
    var users_x = 700; 
    var users_y = 0; 
    _myDesktopApp.getModule('users-module-window').createWindow(users_width, users_height, users_x, users_y); 
}, 

.... 

このコードは、ロードに2つのモジュールウィンドウを開き、サイドでデスクトップ側でそれらを置きます。

Answer 2

ここではスコープの問題が発生しています。 initメソッドをinitComponentに変更してみてください。

Firebugを搭載したFirefoxを使用してアプリをデバッグします。 var b = ... lineにブレークポイントを置き、どの変数がスコープ内にあるかを確認します。