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

Question

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

现在，当调用 render 方法时，我想删除这个初始行，然后附加集合获取的结果。但是 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;
}

None 这些作品。

Answer 1

我认为您不应该覆盖您的渲染。 Marionette 知道如何渲染东西。我会考虑改变你实现微调器的方式。

您可能想在 Show 上放置一个微调器，并在集合同步后将其关闭 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 复合视图渲染的正确方法是什么

What is the correct way to override Marionette compositeview render

backbone.js

marionette