BackboneJs - 模型或集合是不是应该了解视图

Posted 2023-02-26

【中文标题】BackboneJs - 模型或集合是不是应该了解视图

【英文标题】：BackboneJs - Should model or Collection have knowledge of viewBackboneJs - 模型或集合是否应该了解视图

【发布时间】：2012-01-18 08:54:44

【问题描述】：

在我从这里的 SO 答案和许多 BackBoneJs 示例中挑选的一个示例中，我看到初始化函数知道将使用哪个视图来渲染模型。我不知道我现在有点偏见，这是一种好的做法还是取决于正在开发的应用程序的类型。

示例

http://jsfiddle.net/thomas/Yqk5A/

编辑小提琴

http://jsfiddle.net/Yqk5A/187/

代码参考

FriendList = Backbone.Collection.extend(
    initialize: function()
        this.bind("add", function( model )
            alert("hey");
            view.render( model );
        )
    
);

以上是好习惯还是以下

var friendslist = new FriendList;
var view = new FriendView(el: 'body');
friendslist.bind("add", function( model )
            alert("hey" + model.get("name"));
            view.render( model );
        )

在编辑后的小提琴集合中是由一个视图来渲染的，我们也可以使用更多的视图来渲染集合。

【参考方案1】：

我完全赞成使用事件， 我自己不想将绑定移动到模型之外，我会像原始示例一样将它们保留在那里

var app = ;
app.evt = _.extend(, Backbone.Events);  // adding a global event aggregator 

FriendList = Backbone.Collection.extend(
    initialize: function()
        this.bind("add", function( model )
            alert("hey");
            app.evt.trigger('addfriend', model);
        )
    
);

//further in your code you can bind to that event
app.evt.bind("addfriend", function(model)
    var view = new FriendView(el: 'body');
    view.render(model);
);

然而，我发现这个例子有点奇怪，创建一个新视图，以 body 作为元素，并通过为渲染函数提供模型来渲染它。如果视图是使用模型作为属性创建的，然后将内容渲染到正文中，我会发现它更具逻辑性。但那是另一个主题。

简而言之，我将在外部创建视图，监听正在触发的事件，但集合上的绑定保留在集合代码中。我发现将所有集合代码保存在同一个位置更易于管理。

【讨论】：

还有一点我想问的是，收藏不是持有模型的任务吗？它们以更明确的方式帮助管理具有糖功能的模型集

当然，你不需要使用集合，虽然在我看来它不仅仅是糖函数，它们可以很好地与视图一起使用，例如渲染列表，或者你可以绑定到的事件，但是简而言之，你选择你想要使用的元素，如果你不想使用它们，主干绝不会要求你使用集合。

【参考方案2】：

我认为集合不应该知道用于呈现它的视图。我知道在我的项目中，同一个集合以多种方式呈现，因此这种方法会迅速恶化。

一般来说，我将集合传递给呈现集合的视图，视图将侦听集合的添加/删除/更新事件以呈现元素。集合视图将了解子视图。

查看以下链接（系列中的第 3 篇博客），尤其是 UpdatingCollectionView。这是我发现有用的方法。

http://liquidmedia.ca/blog/2011/02/backbone-js-part-3/

【讨论】：

正是我在这里的确切问题，模型不应该绑定到视图。我可以使用任何视图来渲染模型，那么code#2 证明这一点还是坚持使用code#1 好？

是的，代码#2 更好恕我直言。我又走了一步，说如果你正在渲染一个集合，我会为这个集合创建一个视图——在你的情况下，类似于FriendListView。添加事件的绑定应该在FriendListView内。