在 Marionette CompositeView 中显示空视图

Question

我正在使用 Marionette CompositeView 来呈现 html 表格。效果很好！现在我想在集合中没有记录时显示一条消息。我目前正在使用 emptyView 属性来呈现此消息。但是，该消息在表格包装器中呈现，并且表格列标题仍然可见。不完全是我想要的。理想情况下，我想隐藏/删除表格并显示空记录视图，然后在添加记录时显示它。我正在努力寻找处理此问题的最佳方法。有什么建议吗？

EmptyView = Marionette.ItemView.extend({
template: "#empty-template"
});

SupportMemberView = Marionette.ItemView.extend({
template: "#member-template"
});

SupportTeamView = Marionette.CompositeView.extend({
template: "#support-team-template",
itemView: SupportMemberView,
emptyView: EmptyView,
itemViewContainer: 'tbody'
});

Answer 1

接受的答案在空视图和模板之间强加了依赖关系，感觉不对。

我认为另一种方法是在复合视图中使用动态模板。这是通过覆盖基本 View getTemplate() 方法来完成的。因此，您的复合视图将定义如下，假设您可以访问 underscore.js 库或等效替换“_.isEmpty()”函数：

SupportTeamView = Marionette.CompositeView.extend({
getTemplate: function() {
  if (_.isEmpty(this.collection)) {
       return "#empty-template"
  } else {
       return "#support-team-template";
  }
itemView: SupportMemberView,
emptyView: EmptyView,
itemViewContainer: 'tbody'
});

Answer 2

您可以做的一件事是在您的空视图上使用 onRender 函数来隐藏表格。该函数在渲染函数之后调用，因此您将能够操纵 dom 以使其看起来像您想要的那样。