3

我想让多个路由器生活在一个页面上以实现模块化。$(document).ready()我在不同的 js 文件中初始化路由器。当我只有一个可以正常工作的路由器时,因为我可以History.start()在初始化路由器后立即调用,但现在我有多个可以从不同文件初始化的路由器,我不确定何时调用History.start().

例如:

<script src="router1.js" type="text/javascript"></script>
<script src="router2.js" type="text/javascript"></script>

在 router1.js 中:

$(document).ready(function(){
  new Core.Routers.Router1()
});

路由器2也是如此。

最好的解决方案是在页面末尾添加一个新$(document).ready()的调用吗?History.start()我不认为文档就绪调用是阻塞的,所以这不会引入一个竞争条件,即所有路由器在History.start()被调用时可能还没有被初始化。

4

2 回答 2

8

你只需要Backbone.history.start()在你的应用程序中调用一次,调用它的唯一标准是至少一个路由器必须已经实例化。

因此,您可以轻松地做到这一点:


$(function(){
  new MyRouter();
  Backbone.history.start();
});


$(function(){
  new AnotherRouter();
});


$(function(){
  new AndMoreRouters();
});

我定期对路由器做类似的事情,并且我经常在页面加载很久并且用户与页面交互之后启动新路由器。

不过,FWIW,您可能对我在我的 Backbone.Marionette 插件中拥有的初始化程序的想法感兴趣,并作为这篇博客文章的一部分进行了记录:http: //lostechies.com/derickbailey/2011/12/16/composite-javascript-带有骨干和骨干木偶的应用程序/

于 2012-05-23T02:57:51.990 回答
0

您还可以检查Backbone.History.started...

    var Router = Backbone.Router.extend({
        routes: {
            '': 'load'
        },
        initialize: function () {

        },
        load: function () {

        }
    });

    $(function () {
        new Router();
        if (!Backbone.History.started) {
            Backbone.history.start();
        }
    });

它是最近在拉取请求中添加的。

一定要看看 Derick 的 Marionette 插件,它非常棒。

于 2012-05-23T03:17:36.970 回答