javascript - Backbone.js自定义集合排序

我有一个带有木偶插件的Backbone.js应用程序。有一个用CompositeView（和ItemViews）渲染的集合，我需要按以下方式对其进行排序：


用户可以重新排列呈现的ItemViews（使用jQuery可排序插件），并且此用户首选项以模型ID数组的形式保存在cookie中
在每次重新加载时，我都希望将获取的集合排序为与此用户偏好顺序的上述数组相同的顺序。


我试图在onRender挂钩中手动对collection.models数组进行排序，然后重新渲染它，但是这种集合操作只是“感觉错了”（并导致无休止的渲染循环）。

是否存在某种更优雅的解决方案来对集合进行排序，使模型具有与其他数组中定义的模型ID相同的顺序？

最佳答案

尝试对集合使用Backbone.Collection#comparator方法，该方法将访问具有ID数组的cookie，并使用它返回1或-1。


  比较器函数采用两个模型，如果第一个模型应该在第二个模型之前，则返回-1；如果它们具有相同的等级，则返回0；如果第一个模型应该在第二个模型之后，则返回1。

var MyCollection = Backbone.Collection.extend({

    comparator: function(model_a, model_b) {
        // In real app array comes from cookie
        var order = [5, 2, 1, 4, 3],
            a_index = order.indexOf(model_a.id),
            b_index = order.indexOf(model_b.id);

        if (a_index > b_index) {
            return 1;
        } else if (a_index < b_index) {
            return -1;
        } else {
            return 0;
        }
    }

});

var my_collection = new MyCollection([
    { id: 1 },
    { id: 2 },
    { id: 3 },
    { id: 4 },
    { id: 5 }
]);

alert(my_collection.pluck('id'));

这是此示例的jsfiddle