Marionette 嵌套复合视图答案

【问题标题】：Marionette nested composite viewMarionette 嵌套复合视图
【发布时间】：2014-09-02 06:22:02
【问题描述】：

我可以使用嵌套复合视图来制作这样的输出吗？

Nike
  Football, Basketball
Reebok
  Football, Basketball, Running

我确实以这种方式编写了嵌套复合视图。我不确定是否有其他更好的方法或最佳实践方法来实现这一点。

结构：

BrandCompositeView
   itemView: Layout1
                #brand<-BrandView (Nike, Reebok)
                #sport<-SportCompositView 
                           itemView: SportView 


BrandCompositeView (generate Nike, Reebok),
itemView of BrandCompositeView is a layout1 with div id are(#brand, #sport)

SportCompositView (generate Football, Basketball, Running)
itemView of SportCompositView is SportView

BrandView and SportView are itemView

Layout1 is Marionette.Layout

在 Layout1.js 中

initialize:function(){
  this.brandView = new BrandView({"model": this.model});
  this.sportView = new SportCompositView({"collection":collection});
}

onRender: function () {
   this.brand.show(this.brandView);
   this.sport.show(this.sportView);
}

【问题讨论】：

所以你有一个品牌的集合，每个品牌都有体育活动的集合，你必须把它渲染成一个嵌套列表？
是的，这只是一个例子。我必须做类似的事情。它现在正在工作，但我不确定它是否是正确的方法。
查看这篇文章 - 它非常接近您正在寻找的内容stackoverflow.com/questions/25232982/…

标签： backbone.js marionette

【解决方案1】：

是的，这是可能的。

我用于树结构的方法 - article.

【讨论】：

【解决方案2】：

如果我想做这个（多于 1 个孩子的收藏？）

Car: [
    {
    Car1
       name: car1
       image: [{img1}, {img2}, {img3}]
       comment: [{comment1}, {comment2}, {comment3}]
       price: $1000
    },
    {
    Car2
       name: car1
       image: [{img1}, {img2}, {img3}]
       comment: [{comment1}, {comment2}, {comment3}]
       price: $2000
    }
]


<script id="car-template" type="text/template">
  <li><%= name %></li>
  <div id="photo-container"></div>
  <li><%= price %></li>
  <div id="comment-container"></div>
</script>

【讨论】：

【解决方案3】：

实际上，我几天前刚刚写了一个可能对您有所帮助的答案。看看这个线程 - Construct views for data nested several levels deep

基本上，它让您使用主干关系来自动处理所有嵌套。然后你可以在你的复合视图中为你的复合视图抽象出来。

【讨论】：