Backbone.js 使用CompositeView、Collection和ItemView进行复杂渲染

我有一个CompositeView、Collection和ItemView运行良好。它实际上是在获取我的结果，这太棒了。我的问题是，我必须建立一个列表（使用

），但每3项就要拆分一次

渲染输出应如下所示：

<div id="feed">
    <ul class="feed">
        <li><img src="assets/img/1.jpg"></li>
        <li><img src="assets/img/2.jpg"></li>
        <li><img src="assets/img/3.jpg"></li>
    </ul>

    <ul class="feed">
        <li><img src="assets/img/4.jpg"></li>
        <li><img src="assets/img/5.jpg"></li>
        <li><img src="assets/img/6.jpg"></li>
    </ul>
</div>

appendHtml : function (collectionView, itemView, index) {
  if (! index % 3) {
    this.$("#id").append("<ul class='feed'/>");
  }
  this.$("#id ul:last").append(itemView.el);
}

我已成功呈现了一个包含所有列表元素的

，但。。。我怎样才能做出类似上述输出的东西？我真的不知道如何开始

---

提前谢谢

您可以通过覆盖

appendHtml

方法来更改

CollectionView

/

CompositeView

呈现项目的方式。您将需要执行以下操作：

<div id="feed">
    <ul class="feed">
        <li><img src="assets/img/1.jpg"></li>
        <li><img src="assets/img/2.jpg"></li>
        <li><img src="assets/img/3.jpg"></li>
    </ul>

    <ul class="feed">
        <li><img src="assets/img/4.jpg"></li>
        <li><img src="assets/img/5.jpg"></li>
        <li><img src="assets/img/6.jpg"></li>
    </ul>
</div>

appendHtml : function (collectionView, itemView, index) {
  if (! index % 3) {
    this.$("#id").append("<ul class='feed'/>");
  }
  this.$("#id ul:last").append(itemView.el);
}

appendHtml:函数（collectionView、itemView、index）{
如果（！索引%3）{
本.$（“#id”）.append（“
”）；
}
这个.$（“#id ul:last”）.append（itemView.el）；
}