Javascript 如何在fetch（）之后对主干js集合进行正确排序

我绞尽脑汁想弄清楚如何在页面负载上对主干集合进行排序。这方面的文档似乎有点少，因为定义一个比较器显然是不够的。我能找到的所有例子似乎都集中在比较器的定义上，这不应该是我的问题

以下是一个基本示例，说明了我的问题：

$(function() {

var Item = Backbone.Model.extend({
    defaults: {
        amount: 0
    },

    sync: function(method, collection, options) {
        options.url = this.methodToURL(method.toLowerCase());
        Backbone.sync(method, collection, options);
    },

    methodToURL: function(method) {
        switch(method) {
            case 'create':
                return "item";
                break;
            case 'read':
                return "item/" + this.get('id');
                break;
            case 'update':
                return "item";
                break;
            case 'delete':
                return "item/" + this.get('id');
                break;
            default:
                return "";
        }
    }

});

var ItemList = Backbone.Collection.extend({
    model: Item,

    url: 'items',

    comparator: function(item) {
        return item.get("amount");
    }
});

var items = new ItemList;

var ItemView = Backbone.View.extend({
    tagName: 'tr',
    template: _.template($("#item-template").html()),

            render: function() {
                   this.$el.html(this.template(this.model.toJSON()));
                   return this;
            }
    });

var AppView = Backbone.View.extend({
    el: $("#item-view"),

    initialize: function() {
        this.amount = $("#item-amount");
        this.listenTo(items, 'add', this.addItem);
        items.fetch();
    },

    addItem: function(item) {
        var view = new ItemView({model: item});
        $("#item-list").append(view.render().el);
    }

});

var app = new AppView();

});

---

我认为您最好听集合上的

“sync”

事件，而不是

“add”

事件

“

add”

事件可能会在单个项目添加到集合中时被调用，并且它们可能不会按照最终排序的顺序添加

因此，请尝试将

listenTo

行更改为：

this.listenTo(items, 'sync', this.addItems);

然后，您的addItems函数可以重新编写为：

addItems: function(items) {
    $("#item-list").empty();
    items.each(function(item) {
        var view = new ItemView({model: item});
        $("#item-list").append(view.render().el);
    });
}

---

我认为您最好听集合上的

“sync”

事件，而不是

“add”

事件

“

add”

事件可能会在单个项目添加到集合中时被调用，并且它们可能不会按照最终排序的顺序添加

因此，请尝试将

listenTo

行更改为：

this.listenTo(items, 'sync', this.addItems);

然后，您的addItems函数可以重新编写为：

addItems: function(items) {
    $("#item-list").empty();
    items.each(function(item) {
        var view = new ItemView({model: item});
        $("#item-list").append(view.render().el);
    });
}

---

这正是我想要的，这正是我想要的。