1

所以我对我的骨干路由设计有点进退两难，我想看看其他人是怎么想的或试图做些什么来解决这个问题。

基本问题是我正在编写一个具有多个视图的应用程序，并且每个视图中都有嵌套视图，并试图避免使用一个主干路由器来控制这些视图和嵌套视图的状态。

问题的例子是：

Backbone.Router.extend({ routes: 
'view1' : ..., 'view2Nested': ..., 
'View2NestedNested' ...});

视图布局：

  • 视图1
    • View1嵌套
  • 视图2
    • View2嵌套
    • View2Nested嵌套

在此配置中，路由器现在必须了解 View2NestedNested 以便向其发送任何操作信息，这可能意味着主路由器必须持有对视图的引用或了解 view2 并获取它对 view2Nested 的引用，然后向该视图询问 view2NestedNested .

4

1 回答 1

0

我的方法是通过引用它的父级来创建视图。

所以基本上你的观点看起来像这样：

var ViewAA = Backbone.View.extend({
    initialize: function(options) {
         this.parent = options.parent
    },

    render: function() {
         this.parent.router.navigate("viewA/viewAA");
    }
});

var ViewA = Backbone.View.extend({
    initialize: function(options) {
         this.router = options.router
    },

    render: function() {
       this.nestedView = new ViewAA({ parent: this });
    }
});

var router = new Router();

var viewA = new ViewA({ router: router });

第二种方法，我在更复杂的应用程序中使用的是使用一个全局变量......它看起来像这样：

var ViewAA = Backbone.View.extend({
    initialize: function(options) {

    },

    render: function() {
         app.router.navigate("viewA/viewAA");
    }
});

app = {
    router: new Router(),
    classes: {
        ViewA: Backbone.View.extend({ ... }),
        ViewAA: Backbone.View.extend({ ... })
    },
}

app.viewA = new app.classes.ViewA();
app.viewAA = new app.classes.ViewAA();

提示：使用 RequireJS 和 AMD 方法总是更好，所以你可能也想尝试一下。

于 2013-03-28T21:17:32.490 回答