在集合中移动骨干模型的最佳实践答案

【问题标题】：Best Practice for moving backbone model within a collection在集合中移动骨干模型的最佳实践
【发布时间】：2013-08-17 19:42:51
【问题描述】：

How can I move a model within a collection?

我有一个 Backbone 集合，在列表中直观地表示。此列表是可拖放的。任何项目都可以移动到集合中的任意位置（即 - 不是排序）。我已经看到了一些使用集合的本机删除/添加将模型放置在正确位置的示例。但是，Backbone 在添加模型时内部调用 set，然后调用一堆与事件相关的方法并在最后对其进行排序。 将模型拼接到正确的位置有什么缺点吗？

删除/添加：请参阅第一个链接问题中的示例。

拼接：第二个例子

我目前正在使用的功能：

    moveTo: function(oldIndex, newIndex){
        oldIndex = oldIndex instanceof Backbone.Model ? this.at(oldIndex) : oldIndex;
        var spliced = this.models.splice(oldIndex, 1);
        this.models.splice(newIndex, 0, spliced[0]);
        this.trigger("move",[oldIndex,newIndex]);
    },

【问题讨论】：

你确定这不是排序吗？拖放以移动事物是手动更改元素索引，而数组/集合或多或少是按索引排序的。
我想“技术上”你可以称之为排序，我只是说它是任意的，而不是基于数组属性的自动排序。但我认为您指出这相当于“排序”，因为两者都只是重新排列项目，因此 Backbone 没有问题。
我的问题可能更好地表达为 - “是否有过您想要删除模型并将其重新添加到集合中的情况，而不是手动“排序”它们？” ;)

标签： javascript backbone.js backbone.js-collections

【解决方案1】：

我为我最近的项目编写了这个解决方案。它似乎与您描述的界面相似 - 可排序列表。此方法绑定到集合。

reorder: function(new_index, original_index) {
    // If nothing is being changed, don't bother
    if (new_index === original_index) return this;
    // Get the model being moved
    var temp = collection.at(original_index);
    // Remove it
    collection.remove(temp);
    // Add it back in at the new index
    collection.add(temp, { at: new_index });
    return this;
}

我自己的大部分代码已被删除，但这是核心功能。 Backbone 的 at 选项让这变得非常简单。

【讨论】：

您可能希望使remove 和add 调用静音，以防止对侦听集合和其中模型的视图进行不必要的更改。您可能还想创建自己的 move 事件，让听众做出相应的反应。