Question

我对comparator中的Backbone.Collection函数感到满意，我对于对集合进行排序然后从视图中重绘整个事物的想法感到满意。但是，我不是在这里寻找。

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

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

理想情况下，我应该能够从集合视图中删除已更改的模型，然后将其重新插入到集合视图中的新的适当位置（因此我只执行一次DOM删除和一次DOM添加 - 而不是清理然后重新绘制整个模型集合）。我当然可以手动执行此操作，无需主干的任何帮助，但我想我会问是否有任何主干功能可以使其更容易，或至少更简化。完全在骨干之外做这个看起来像是一个黑客，它看起来不会很漂亮。

Answer 1

我想我知道你在做什么。假设您可以访问相关模型和视图，这是一个基本方法：

// 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）如何将模型和视图链接在一起。

有一个（有些）类似的问题问here。但是，与我在上面的链接中突出显示的答案相反，如果我可以避免使用DOM遍历代码，而不是依赖于骨干集合的排序，我宁愿不使用DOM遍历代码。

尽管如此，我认为这正是您所寻找的。如果没有，请尽可能具体说明遗漏的内容。

编辑后将模型重新插入到已排序的集合视图中

1 个答案: