Jquery 将模型重新插入已排序的集合'；编辑后的视图

我对

Backbone.Collection

中的

comparator

功能很满意，我也很满意对集合进行排序，然后从视图中重新绘制整个集合。然而，我不是在这里寻找

我有一个已分类（装载时）的集合。一个视图侦听集合，并负责在“重置”时对其进行迭代。该系列的模型有自己的观点。这里没有什么不寻常的事

但是，用户可以在线编辑每个模型，可能会更改比较器函数中的属性值。显然，一种解决方案是清除整个集合的视图，重新排序集合，然后重新绘制所有模型的视图。但如果可能的话，我想避免这样做

---

理想情况下，我应该能够从集合视图中删除修改过的模型，然后将其重新插入集合视图中新的、适当的位置（因此我只进行一次DOM删除和一次DOM添加，而不是清除然后重新绘制整个模型集合）。我当然可以手动完成这项工作，而不需要主干网的任何帮助，但我想问一下主干网是否有任何功能可以让它更简单，或者至少更精简。完全在主干之外做这件事看起来像是一种黑客行为，而且看起来也不好看。

我想我知道你的意思。假设您可以访问相关的模型和视图，下面是一种基本方法：

// assumption: this is called on "change" event, only once
re_insert_item : function(model,m_view,collection,c_view) {

    // remove the model's view from the DOM
    m_view.$el.remove();

    // assuming there is a comparator, sort() will move the
    // model into the correct position of the collection. since
    // we're not doing a .remove and .add, we have to sort manually
    // (as per documentation instructions)
    collection.sort();

    // figure out the model that, based upon its sort position, our
    // edited model will come *before*
    var idx = collection.indexOf(model);
    var next_model = collection.at(idx+1);

    // insert our model's view into the DOM right above it's neighbour
    // this assumes you have some way to get a view for a given model,
    // which there isn't really a "standard" way to do (it seems)
    if ( next_model ) {
        var next_m_view = ??? // assume you have some way to get this
        next_m_view.$el.before(m_view.render().$el);
    }

    // this model is last in the list, so just append it to the
    // collection view (assuming the collection view houses the
    // master list as its $el)
    else {
        c_view.$el.append(m_view.render().$el);
    }
}

您必须根据以下情况更改一系列代码：a）您计划将代码放在何处，即从何处/如何获取函数参数；b） 如何将模型和视图链接在一起

有一个（有点）类似的问题被问到了。然而，与我在上面的链接中强调的答案相反，如果可以避免的话，我宁愿不使用DOM遍历代码，而是依赖主干集合的顺序

---

不过，我想这就是你要找的。如果没有，请尽可能具体地说明遗漏的内容。

我想我知道你的意思。假设您可以访问相关的模型和视图，下面是一种基本方法：

// assumption: this is called on "change" event, only once
re_insert_item : function(model,m_view,collection,c_view) {

    // remove the model's view from the DOM
    m_view.$el.remove();

    // assuming there is a comparator, sort() will move the
    // model into the correct position of the collection. since
    // we're not doing a .remove and .add, we have to sort manually
    // (as per documentation instructions)
    collection.sort();

    // figure out the model that, based upon its sort position, our
    // edited model will come *before*
    var idx = collection.indexOf(model);
    var next_model = collection.at(idx+1);

    // insert our model's view into the DOM right above it's neighbour
    // this assumes you have some way to get a view for a given model,
    // which there isn't really a "standard" way to do (it seems)
    if ( next_model ) {
        var next_m_view = ??? // assume you have some way to get this
        next_m_view.$el.before(m_view.render().$el);
    }

    // this model is last in the list, so just append it to the
    // collection view (assuming the collection view houses the
    // master list as its $el)
    else {
        c_view.$el.append(m_view.render().$el);
    }
}

您必须根据以下情况更改一系列代码：a）您计划将代码放在何处，即从何处/如何获取函数参数；b） 如何将模型和视图链接在一起

有一个（有点）类似的问题被问到了。然而，与我在上面的链接中强调的答案相反，如果可以避免的话，我宁愿不使用DOM遍历代码，而是依赖主干集合的顺序

---

不过，我想这就是你要找的。如果没有，请尽可能具体地说明遗漏的内容。

我不太明白你的问题，但“清除整个收藏”是什么意思？当您的特色属性更改时，为什么不能对集合调用

sort

，并在集合视图中侦听

sort

事件，然后调用

render

？我编辑了这个问题，试图让它更清楚。这实际上是一个视图问题，而不是收集/排序问题。显然，我没能正确地解释我自己。希望现在更好了。所以你问的是关于更改DOM元素的排序顺序？有点。我试图使DOM元素的顺序与集合模型的（新排序的）顺序相匹配，而不必重新绘制每个模型。我不太明白你的问题，但是“清除整个集合”是什么意思？当您的特色属性更改时，为什么不能对集合调用

sort

，并在集合视图中侦听

sort

事件，然后调用

render

？我编辑了这个问题，试图让它更清楚。这实际上是一个视图问题，而不是收集/排序问题。显然，我没能正确地解释我自己。希望现在更好了。所以你问的是关于更改DOM元素的排序顺序？有点。我试图使DOM元素的顺序与集合模型的（新排序的）顺序相匹配，而不必重新绘制每个元素。回答。非常感谢您的详细回复！所以我想我会在模型本身中保留对每个模型视图的引用。不客气！）至于模型/视图链接，这并不是一个好方法。查看SO thread，了解一些想法。回答。非常感谢您的详细回复！所以我想我会在模型本身中保留对每个模型视图的引用。不客气！）至于模型/视图链接，这并不是一个好方法。查看SO线程以获取一些想法。