2016-09-07 8 views
0

私はMarionette 3.0を使用します。リージョン内に新しい子ビューを含むビューを構築する

私はBlockViewを持っていて、領域の数が可変である可能性があります。 これらの領域は、CollectionViewsであるBlockRegionViews(これは2.xになります)で埋められ、これらのビューはさらにBlockViewをレンダリングします。 既に(空の)BlockRegionViewsで満たされた領域を持つBlockViewを作成し、このBlockViewを返す関数を作成したいと思います。

だから私はこのコードを書いている:もちろん

var blockView = new BlockView({model: blockModel}); 
var regions = blockModel.get('regions') 
for(var i in regions) { 
    var blockRegionModel = regions[i]; 
    var blockRegionView = new BlockRegionView({model: blockRegionModel}); 
    blockView.addRegion(blockRegionModel.get('position'), '...regiondefinition...'); 
    var region = blockView.getRegion(blockRegionModel.get('position')); 
    // This is the line where i get the error. 
    region.show(blockRegionView); 
} 
return blockView; 

私のコードが悪いです。 show関数の名前でさえ、私にとっては適切な関数ではないことを示唆しています(私はこの時点でビューを表示したくないので)。しかし、ドキュメントではこのようなものを見つけることはできません。

私の質問は、どのように他のビューをレンダリングせずにリージョンで初期化されたビューを作成する必要がありますか?

+0

CollectionViewsはまだMarionetteの3.xバージョンの一部ですが、LayoutViewとItemViewはViewと呼ばれています(いずれにしても非常に似ています)。 – miphe

答えて

0

私が正しく理解している場合は、ビュー内でビューをレンダリングし、すべてが初期化されるまでレンダリングしません。

あなたの説明のブロックモデルと地域の扱いが少し混乱していたので、これをあなたのケースに適用してください。

a View's lifecycleのドキュメントが参考になります。

var ChildView = Mn.View.extend({..}); 

var ParentView = Mn.View.extend({ 
    template: //.., 
    onBeforeRender: function() { 
    this.showChildView('reg1', new ChildView({model: someModel})); 
    }, 
    regions: { 
    reg1: //.. 
    } 
}); 

上記の例では、ChildViewParentViewがレンダリングされる前ParentViewにインスタンス化および添付されるであろう。しかし、ParentViewがレンダリングされると、ChildViewsはインスタンス化され、レンダリングされます。

あなたは何もレンダリングしたくないと述べました。まれなケースですが、レンダリングイベントの外部で子ビューをインスタンス化できます。

var ChildView = Mn.View.extend({..}); 

var ParentView = Mn.View.extend({ 
    template: //.., 
    initialize: function() { 
    this.childView = new ChildView({model: someModel}); 
    }, 

    // You can decide whenever you want to show the childView 
    // and invoke this method. 
    showTheChildView: function() { 
    this.getRegion('reg1').show(this.childView); 
    }, 

    regions: { 
    reg1: //.. 
    } 
}); 

願わくはあなたの質問を正しく理解しました。

関連する問題