2

这是 Derick Baileys 博客(Backbone.Marionette 的创建者)的引述:

但是路由器永远不应该实例化视图并直接使用 jQuery 操作 DOM 或将视图放入 DOM

但我一直看到这样的代码:

var Router = Backbone.Router.extend({
    routes: {
        "":home
    },
    home: function(){
        // instance of a view object in a router
        var homeView = new HomeView({model:model});
        // do something with homeView 

    })

尽管它被广泛使用,但这可以被认为是反模式吗?从我的角度来看,将定义与对象的实例化分开是一个好主意(稍后调用new HomeView() )。但这是否可以在路由器中找到?

4

2 回答 2

4

其他人在您所指的文章的评论中提出了同样的问题。这是我同意的 Derick 给出的答案,我正在复制它以保持中心化。

这两个示例在功能上是相同的:

示例 1

Backbone.Router.extend({
  routes: {
    "foo": "showFoo"
  },

  showFoo: function(){
    var fooView = new FooView();
    fooView.render();
    $("#someEl").html(fooView.el);
  }
});

示例 2

Backbone.Router.extend({
  routes: {
    "foo": "showFoo"
  },

  showFoo: function(){
    FooApp.show();
  }
});

FooApp = {
  show: function(){
    var fooView = new FooView();
    fooView.render();
    $("#someEl").html(fooView.el);
  }
}

两者的区别在于耦合、内聚、封装、关注点分离和单一职责原则。如果我想更改 FooApp 显示应用程序视图的方式并使事情正常运行,我不应该更改路由器。这两个问题应该分开。对于路由器和 FooApp(高级应用程序对象),我应该有“一个改变的理由”。

对于一个小型演示应用程序,#1 是可以的。但是,任何超过 1 或 2 个视图的东西,代码都会很快变得无法维护。根据我的经验,必须筛选所有实际显示的琐事,以便您可以看到路由器整体在做什么,这是一个非常糟糕的主意。

有关这方面的更大示例,请查看我的 BBCloneMail 示例项目:http://github.com/derickbailey ... - 查看 BBCloneMail.Router.js 文件。

于 2013-07-14T15:22:28.530 回答
0

我更喜欢在 router.initialize() 中只初始化所有视图一次,然后在路由方法中渲染它们。但我不认为它有那么大的不同。

于 2013-07-14T15:04:35.527 回答