主干:使用比较器反向采集顺序

Backbone: reverse collection order with comparator

本文关键字：顺序 比较器 主干      更新时间：2023-09-26

我正在构建一个Backbone应用程序，它显示书籍列表，但当我通过编辑视图添加新书时，他会转到列表的底部，而不是顶部。所以基本上我想用Comparator来反转我的收藏顺序，但我尝试的是不起作用：

comparator: function (model) {
    return -model.get('id');
}

下面是一个包含所有代码的JSFiddle：http://jsfiddle.net/swayziak/9R9zU/4/

我不知道这个问题是否只与比较器有关，或者我是否需要在代码的其他部分更改更多内容。

为什么不使用简单的prepend而不是append

this.$el.prepend(

您的比较器正在查找型号ID:

comparator: function (model) {
    return -model.get('id');
}

但您的模型都没有CCD_ 3属性。通常id将来自服务器，因此服务器将在引导集合时提供初始id值，然后在save模型时（由服务器）分配新的id。

如果你在数据中添加id，那么事情就会变得更有意义。

你还需要调整你的小提琴：

this.listenTo(this.collection, 'add', this.render);

而不是：

this.listenTo(this.collection, 'add', this.renderBook);

因为您的编辑面板将杀死所有HTML，并且您需要重新呈现整个集合。

一旦你克服了这一点，你会发现你的编辑链接不再有效。这是因为您试图重复使用视图，同时篡改它们的el的内容。相反，您应该：

  1. 停止尝试重复使用视图，这几乎永远不值得麻烦
  2. 为每个视图指定其唯一的el
  3. 在将新视图放入公共容器之前，调用view.remove()以清除视图
  4. 然后创建新视图，对其进行渲染，并将其el放入容器中

您会发现，由于所有视图共享一个公共容器，您将不再需要将集合视图绑定到集合的'add'事件，而是要抛出并重新构建整个视图。

相关文章：