Backbone.js 集合保留新的排序顺序吗？

Question

好的，我正在使用 jQuery UI 对一组仪表板小部件进行排序，并希望保留小部件的新顺序。对此最好的方法是什么？有什么想法吗？

我正在考虑在模型中赋予“顺序”属性，如下所示：

widgetsModel: Backbone.Model.extend({
    defaults: {
        name: 'Widget',
        category: 'uncategorized',
        order: '0',
        content: 'No Content'

    },

    initialize: function(i) {
        this.bind("change:name", function() {
            var name = this.get("name");
            console.log('From Model: '+name);
        });

        this.bind('error', function(model, error) {
            alert(error);
        });

    }

})

然后在集合中我有这个：

widgetsCollection: Backbone.Collection.extend({

    model: mw.models.widgetsModel,

    localStorage: new Store('widgets_'+mw.mainTab),

    initialize: function(widget){

        var $this = this;

        _.bind('add', function(widget){
            //console.log(widget.get('name'));
        });

        $('#dash_widget_container').sortable({
            items:'.module_wrap',
            accepts:'.module_wrap',
            handle: '.module_header',
            tolerance: 'pointer',
            revert:true,
            placeholder: "ui-state-highlight"
        });


    },

    nextOrder: function() {
        if (!this.length) return 1;
        return this.last().get('order') + 1;
    },

    comparator: function(widgets) {
        return widgets.get('order');
    }

})

此时我陷入困境。有什么想法吗？

Answer 1

如何重置 WidgetsCollection，然后将 WidgetModel 放回新顺序。

console.log(widgetsCollection.models) // => model1, model2, model3
widgetsCollection.reset([model2, model3, model1]);
console.log(widgetsCollection.models) // => model2, model3, model1

您可以使用 JQuery UI 来获取新订单。这样它们就会按顺序保存，并且没有额外的开销。