0

私はbackbone.js+require.jsアプリケーションを構築していますが、次の問題が発生しました。アプリケーションを構造化するためにApp.js、次の内容のファイルがあります。

define(function(require) {
    'use strict';

    var _ = require('underscore'),
        Backbone = require('backbone'),
        Router = require('router'),
        ModuleManager= require('moduleManager');

    var App = function App() {
        var base = {
            router: new Router(),
            moduleManager: new ModuleManager(),
            start: function start(){
                Backbone.history.start({pushState: true});
                this.router.navigate('home', {trigger: true}); 
            }   
        };
        return _.extend(
            base, 
            Backbone.events
        );
    };

    return App;

});

アプリケーションは、、、の順に起動されwindow.myApp = new App();ますmyApp.start();。

内容は以下のrouter.js通りです。

define(function(require) {
    'use strict';

    var _ = require('underscore'),
        Backbone = require('backbone');

    var Router = Backbone.Router.extend({
        routes: {'home': 'home'},
        home: function home() { 
            // MY ISSUE IS HERE
            App.moduleManager.add('moduleName');
        }       
    });

    return Router;
});

これmoduleManagerは、次のユーティリティ関数/オブジェクトです。

  • App.moduleManager.add('module')require.jsファイル（バックボーンビュー+コレクション）を要求することでアプリケーションモジュールを追加 し、
  • いくつかのチェックを行う（たとえば、モジュールがまだ存在していないことを確認する）、
  • モジュールを一元的に保存するApp.moduleManager.modules

次の点を除いて、すべて正常に機能しています。 内部または他のルートから電話をかけるにはどうすればよいですか（ ）？App.moduleManagerApp.router.homeApp.router.xyz

  • 内App.router.homeでは、 （？）thisを参照できませんApp
  • 内では、との間で循環依存関係を作成するため、router.js呼び出すことができません。App = require('app')App.jsRouter.js

グローバルなアプリケーション構造の問題があるのか​​、それともこの問題を回避できる単純な言語構造があるのか​​はわかりません。あなたが提供できるどんな助けにも感謝します。

4

1 に答える 1

1

必要なオブジェクトをルーターのコンストラクターに渡すことができます。

ただし、イベントを使用することをお勧めします。ルートでイベントをトリガーし、アプリでそのイベントをリッスンします。これにより、ルーターは単一のジョブを実行し、ブラウザーからのルート変更（戻る/進むクリック）に応答します。

ルーター内：

home: function() { 
    Backbone.trigger('home:show');
}

アプリ内：

start: function(){
    Backbone.history.start({pushState: true});
    Backbone.on('home:show', this.showHome, this);
},  

showHome: function(){
    this.router.navigate('home', {trigger: false}); // just update, dont trigger route
    this.moduleManager.add('moduleName');
}

これで、アプリがコードから表示する内容を変更したい場合はnavigate、ルーターを呼び出す代わりに、このイベントをトリガーすることができます。

他のコード、おそらくメニュービュー：

homeClicked: function(){
    Backbone.trigger('home:show');
}

これにより、ホームビューが表示され、履歴も更新されます。

于 2013-03-20T16:59:03.057 に答える