Question

我正在构建一个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.moduleManager或任何其他路线（App.router.home）内拨打App.router.xyz？

在App.router.home内，this无法引用App（？）
在router.js内，我无法致电App = require('app')，因为我会在App.js和Router.js之间circular dependency

我不确定我是否有全局应用程序结构问题，或者是否只有一个简单的语言结构可以解决这个问题。感谢您提供的任何帮助。

Answer 1

您可以在路由器的构造函数中传递所需的对象。

但我会建议使用事件。在路线中，触发事件，然后在应用程序中侦听该事件。这使路由器完成一项工作，响应浏览器的路由变化（后退/前进点击）。

在路由器中：

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

在app中：

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');
}

这将显示您的主视图，并更新历史记录。

从App.router.method中访问App.method

1 个答案: