listview - 我可以为 Marionette 的复合视图创建 2 个 itemViewContainers 吗？

Question

我正在实现一个 2 列布局视图，如下所示：

然而，当我定义我的木偶复合视图时，似乎只允许使用一个 itemViewContainer。

我可以做这样的事情吗？

class List.Muse extends Marionette.ItemView
  template: JST["backbone/templates/muses/index"]

class List.Muses extends Marionette.CompositeView
  template: JST["backbone/templates/muses/list"]
  itemView: List.Muse
  itemViewContainer: ".left_col"
  itemViewContainer: ".right_col"

//list template
.muses_container.two_col_wrapper.hide
  .left_col
  .right_col
  .clearfix
.loading_container

本质上，我想在我的列表模板中的“左”和“右”列中交替插入缪斯。这可以在复合视图中定义吗？

Answer 1

为此，您应该使用 Layout 而不是 CompositeView。布局允许您定义任意数量的区域，然后在每个区域中独立显示一个 ItemView（或任何其他类型的 View）。

Answer 2

您要在此处使用的Marionette视图构造是Layout. 您可以将 aLayout视为ItemView具有内置区域用于将子视图渲染到的区域。像这样的东西就是你所追求的（在 JS 中。对不起，我真的不知道 CS）：

List.Muses = Marionette.Layout.extend({
  template: JST["backbone/templates/muses/list"],
  regions : {
    leftColRegion : ".left_col",
    rightColRegion : ".right_col"
  },

  onRender : function () {
    this.leftColRegion.show(new List.Muse({model : someMuseModel}));
    this.rightColRegion.show(new List.Muse({model : someOtherMuseModel}));
  }
});