16

我开发了一个 jquery &backbone.js 网络应用程序。
一个组件有一个 html 表，该表后面是一个主干.js 集合。
此集合中的任何更改都应该导致 html 表的更新，所以我写 

this.collection.bind("reset add remove", this.renderRows, this);

所以我更新了 html 表，当整个集合变得新时，当一个新模型被添加时，当一个模型被删除时。

当用户悬停并单击 html 表格的某一行时，还会调用一个详细视图组件。在这个组件的开头，我从集合中得到了正确的模型

changeModel = this.collection.get(id);

在用户改变了一些属性之后，我做

changeModel.set(attrs);

并返回到 html 表。集合中的模型具有正确的更改值。

但是 html 表没有更新，因为没有触发 3 个事件（重置、添加、删除）。

所以我在集合绑定中添加了“替换”

this.collection.bind("replace reset add remove", this.renderRows, this);

在从详细视图返回之前，我调用了

this.collection.trigger("replace");

我的解决方案有效，但我的问题是：

是否有任何“本机”backbone.js 解决方案已经存在并且我错过了并且我不必自己触发某些东西？

4

1 回答 1

47

模型中的change事件冒泡到集合中。（注释源中的集合的_onModelEvent函数。该方法基本上只是从模型中获取所有事件并在集合上触发它们。

这将导致

  1. 模型属性已设置
  2. 模型触发器change
  3. 收集渔获物change
  4. 收集触发器change

所以

this.collection.bind("replace reset add remove", this.renderRows, this);

必须用这个替换

this.collection.bind("change reset add remove", this.renderRows, this);

附言

我个人的看法是，如果只更改一个模型，您不应该重绘整个表格。而是使每个表行本身成为一个视图，该视图具有相应的模型作为其模型，然后对那里的属性更改做出反应。如果您只针对一个，那么重新绘制 500 个表格单元格是没有意义的。

更新

现在你应该使用on-method 来绑定事件。

collection.on("change reset add remove", this.renderRows, this);

如果您使用的是 BB 1.0，View并且listenTo在view.remove(). 在这种情况下，您应该这样做：

// assuming this is the view
this.listenTo(collection, "change reset add remove", this.renderRows);
于 2012-09-05T10:31:56.980 回答