如何使不同的意见木偶的集合 [英] How to render a collection of different Marionette Views

问题描述

我想呈现的观点骨干集合。收集可以是任何类型的提线木偶视图（layoutView，CompositeView中，的CollectionView，ItemView控件）的。当我尝试和渲染，我得到的翻译：为使每个视图。这使我相信，它不知道哪个视图渲染时，它抓住一个来自集合。我现在已经在这是假设渲染视图的集合的CollectionView使用getChildView（）开始，但我不确定如何指定我希望孩子成为视图的类型。

I am trying to render a backbone collection of views. The collection could be any kind of marionette view ( layoutView, CompositeView, collectionView, ItemView). When I try and render, I get "[object Object]" for each view that renders. This leads me to believe that it doesn't know which view to render when it grabs one from the collection. I have now started using getChildView() in the CollectionView that is suppose to render the collection of Views but I am unsure how to specify the type of view I want the child to be.

新来木偶和在线资源似乎是渺茫（也许是我错了搜索？）我想有视图中查看（子看法？没有必要的孩子），但没有使用LayoutView并自指定区域子视图的数量可能有所不同，而不是仅仅拥有的CollectionView渲染marionetteViews集合不管有多少。

New to Marionette and online resources seem to be slim (perhaps I am searching wrong??) I want to have Views within views ( sub views? not necessary children) but not have to use LayoutView and have to specify the regions since the number of subviews could vary, instead just have a collectionView render a collection of marionetteViews regardless of how many.

感谢您为您的时间，

推荐答案

所以经过试验，彻底离开这个方法的另一个几天（<一个href=\"http://stackoverflow.com/questions/31465738/does-a-collectionviews-childview-have-to-be-an-itemview\">Does一个的CollectionView的childView必须是一个ItemView控件？），然后返回到它。我感觉好像我已经想通了。

So after a couple days of experimenting, completely leaving this approach for another(Does a CollectionView's childView have to be an ItemView?) and then returning to it. I feel as though I have figured it out.

这方法是一家集/复合视图下嵌套多个Mar​​ionetteView，所以让我们使用可能有任何数量面板的列的例子

This approach is for nesting multiple MarionetteView under a collection/composite view, so lets use an example of a Column that could have any number of panels

首先，我们创建的意见收集列

First we create a collection of views for the column

//These exist in the view...
class PanelView1 extends Marionette.CompositeView
...
class PanelView2 extends Marionette.ItemView
...


columnPanelCollection = new ColumnPanelCollection([
        index: 1,   view: PanelView1, data: dataForPanelView1Collection
    ,
        index: 2,   view: PanelView2 , data: null
    ])

所以我们创建了一个集合列（columnPanelCollection），传递的类型，而不是例如，MarionetteView，所以PanelView1和PanelView2，进入观点：'属性。也传递查看可能需要收集在数据的数据：属性

So we create a collection for the column (columnPanelCollection ), passing the type, not instance, of the MarionetteView, so PanelView1 and PanelView2, into the 'view:' attribute. Also pass any data that view may need in a collection in the 'data': attribute

现在我们把我们刚刚创建的收集到的CollectionView

Now we put the collection we just created into a CollectionView

columnCollectionView= new ColumnCollectionView(
        collection: columnPanelCollection 
    )

在ColumnCollectionView类中，我们使用回调

in the ColumnCollectionView class, we use the callback

getChildView:(model)->
    return model.get('view')

和我们回到了的看法：属性，它是我们要创建的视图的类型，这将创建一个基于该类型子视图。然后在childView的类（所以PanelView1或PanelView2类），我们可以使用昂秀回调并设置基础上，对这一观点的集合'数据：'属性，我们可以提供

and we return the 'view:' attribute which is the Type of View we want created, this will create a child view based on that type. Then in the childView's class (so PanelView1 or PanelView2 class) we can use the onShow callback and set up a collection for that view based on the 'data:' attribute we provided

class PanelView1 extends Marionette.CompositeView
...
template: ....
collection: new PanelDataCollection()

onShow:(view)->
    modelCollection = view.model.get("data").models 
    @collection.reset(modelCollection) if modelCollection

旁注：集合属性仍然必须在PanelView类来指定，这就是为什么我初始化它作为一个新PanelDataCollection（）'，然后将其设置昂秀

sidenote: a collection attribute must still be specified in the PanelView class, this is why I initialize it as a 'new PanelDataCollection()', and then set it onShow

我们就可以使用一个LayoutView并把columnCollectionView进入的地区之一，并表现出来。

We can then use a LayoutView and put the columnCollectionView into one of the regions and show it.

这篇关于如何使不同的意见木偶的集合的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！