7

我正在尝试在集合开始时呈现一个项目（想象一下，如果你在 facebook 上发布一条新记录）

当我来 add(response, {at: 0}); 到集合中，记录在 0 处正确插入到集合中，但呈现在项目列表的底部。我很困惑，因为我以前做过这个工作，但我认为我在做的是一种 hacky 风格，只是重置并重新渲染集合。

我想知道处理这个问题的整洁方法是什么，我应该在哪里绑定逻辑。

是在集合的 add 方法上吗？目前这是空的（但我正在使用 Marionette），我觉得这会覆盖骨干的默认渲染。我如何再次控制它，这样我就可以正确地将我的新项目添加到列表中，而不会全部破坏并重新创建它。

4

2 回答 2

12

在 Marionette 中，将新项目添加到视图中的集合的默认方法是使用 jQuery 的append方法。该CollectionView类型有一个名为的方法appendHtml，用于执行实际的附加操作。（见http://derickbailey.github.com/backbone.marionette/docs/backbone.marionette.html#section-24）

不过，您可以在特定的集合视图中轻松覆盖此方法，并将新模型附加到需要的任何位置。

在您的情况下，如果您总是想将新模型添加到列表的顶部，那么更改您的集合视图以执行此操作非常简单：

Backbone.Marionette.CollectionView.extend({
  appendHtml: function(cv, iv){
    cv.$el.prepend(iv.el);
  }
});

请注意，这cv是集合视图实例，并且iv是集合中模型的项目视图实例。

如果您需要执行更复杂的操作，例如在现有的 HTML 节点集合中查找确切位置，您也可以在appendHtml函数中执行此操作。当然，这比仅仅做前置而不是追加要复杂得多，但它仍然是可能的。

希望有帮助。

于 2012-04-26T01:23:40.200 回答
0

这可能是一个非常古老的问题，但无论如何我都会发布我的解决方案......它通过覆盖 appendHtml 函数，根据新模型添加到集合中的方式（取消移位/添加），在 itemViewContainer 前添加/附加新模型。

appendHtml: function(collectionView, itemView, index){
            if(index > 0) {
                collectionView.$el.find(this.itemViewContainer).append(itemView.el);
            } else {
                collectionView.$el.find(this.itemViewContainer).prepend(itemView.el);
            }
        },
于 2019-08-14T13:28:04.690 回答