在Marionette CompositeView中显示空视图

Gen*_*tor 12 backbone.js marionette

我正在使用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'
});
Run Code Online (Sandbox Code Playgroud)

mrj*_*jmh 8

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

我认为另一种方法是在复合视图中使用动态模板.这是通过覆盖基本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'
});
Run Code Online (Sandbox Code Playgroud)

  • 你的想法的问题是`getTemplate`只被调用一次,你将它绑定到动态的东西 - 集合的内容.因此,这个想法将坚持收集永远不会改变的事实. (2认同)

Ray*_*_on 5

你可以做的一件事就是你的emprty View使用onRender函数隐藏表格.在渲染功能之后调用此函数,因此您可以操作dom以查找所需的方式.