Question

我正在使用Marionette的复合视图显示表格视图。复合视图的模板有一个带有初始值的tbody，它显示了一个加载动画gif。

现在，当调用render方法时，我想删除这个初始行，然后附加collection fetch的结果。然而，Marionette的默认渲染实现似乎是附加到tbody。

项目视图的项目模板：

<td><input type="checkbox" class="checkboxContact" id="<%-id %>"/></td>
<td><%-name %></td>
<td> <%-msisdn %></td>
<td> <%-email %></td>
<!--
<td> <%-address %></td>
<td> <%-last_modified_time %></td>-->
<td>
  <i rel="tooltip" class="fa fa-pencil-square-o actions"  id="editIcon" title="edit"></i>
  <i rel="tooltip" class="fa fa-trash-o actions" title="delete"></i>
</td>

重写的渲染方法，如下所示。

render: function() {
  if (this.collection.size() <= 0) return;

  this.$el.html(this.template((this.collection.toJSON()));
  return this;
}

我也试过

render: function() {
  if (this.collection.size() <= 0) return;

  this.$el.html(this.template({
    collection: this.collection.toJSON()
  }));
  return this;
}

这些都不起作用。

Answer 1

我认为你不应该重写你的渲染。木偶知道如何渲染东西。我考虑改变你实现微调器的方式。

您可能希望将一个微调器放在onShow上，并在收集同步后将其关闭 https://github.com/marionettejs/backbone.marionette/blob/master/docs/marionette.compositeview.md#events-and-callbacks

当集合更新时，您的视图将会重新呈现。你可以听 before:render:collection 如果你愿意，可以擦掉那一行。

Answer 2

如果您使用的是CompositeView，则可以定义：

childViewContainer: "tbody"

复合视图中的

，应该替换内容。

此外，当您使用复合视图时，无需手动调用/定义渲染。只需将Backbone集合传递给视图，如下所示：

var compview = new CompView({ collection: bb_collection });

然后使用区域渲染它：

var region = new Marionette.Region({el: "#somediv"}); 
region.show(compview);

覆盖Marionette复合视图渲染的正确方法是什么

2 个答案: