Question

我正在使用Backbone.js来呈现项目列表，例如Books。呈现列表后，用户可以选择对它们进行排序。因此，如果用户单击“按标题排序”或“按作者名称排序”，则列表将在客户端进行排序。

  window.Book = Backbone.Model.extend({
   defaults: {
     title: "This is the title",
     author: "Name here"
   },

在Backbone应用程序的上下文中使用什么是完成此类排序的最佳方法。我在AppView中使用jQuery dom分拣机吗？

Answer 1

您可能希望查看有关此主题的讨论：https://github.com/documentcloud/backbone/issues/41。

缺点是，当用户选择“按X排序”时，您可以：

在集合

comparator

调用Collection的sort函数（将触发sort事件）
在视图中收听sort事件，然后（清除并重新绘制项目

处理步骤1和1的另一种方法2是拥有自己的方法来调用Collection的sortBy方法，然后触发View可以监听的自定义事件。

但似乎清理和重绘是最简单（甚至可能是最快）的方式来对View进行排序并使它们与Collection的排序顺序保持同步。

Answer 2

您可以更新比较器功能，然后调用sort方法。

// update comparator function
collection.comparator = function(model) {
    return model.get('name');
}

// call the sort method
collection.sort();

视图将自动重新渲染。

Answer 3

您需要

comparator

var PhotoCollection = Backbone.Collection.extend({
    model: Photo,
    comparator: function(item) {
        return item.get('pid');
    }
});

Answer 4

这种方式效果很好，可以动态排序所有attributes并处理ascending或descending：

var PhotoCollection = Backbone.Collection.extend({
    model: Photo,
    sortByField: function(field, direction){
            sorted = _.sortBy(this.models, function(model){
                return model.get(field);
            });

            if(direction === 'descending'){
                sorted = sorted.reverse()
            }

            this.models = sorted;
    }
});

初始化后对骨干集合进行排序

4 个答案: