我对 Marionette collectionView 有疑问。当我没有定义 el 时
var featureditems = new View.CarouselItems({ collection: content });
Collection View :
View.CarouselItem = Marionette.ItemView.extend({
template: carouselItemTpl,
tagName: 'div',
attributes: function() {
var clas = '';
if (this.model.get('ind') == 0) {
clas = ' active'
}
return {
'data-slide-to': this.model.get('ind'),
'data-target': '#homeCarousel',
'class': 'item' + clas
};
},
});
View.CarouselItems = Marionette.CollectionView.extend({
itemView: View.CarouselItem
});
collectionview 渲染封装在 div 标签内的项目,这是有问题的。
当我像这样定义容器元素时:
var featureditems = new View.CarouselItems({ collection: content, el: $("#carousel-inner") });
View 呈现 itemView 的方式如下:
<div class="carousel-inner">
<div class="active item">
<img alt="" class="slide-img" src="./assets/img/avant_floorstand.jpg">
<div class="hero-unit">
</div>
<!--div class="hero-video"></div-->
</div>
<div class="item">
<img alt="" class="slide-img" src="./assets/img/avant_wall.jpg">
<div class="hero-unit">
</div>
</div>
<div class="item">
<img alt="" class="slide-img" src="./assets/img/beovision11_day3jpg jpg.jpg">
<div class="hero-unit">
</div>
</div>
</div>
这是所期望的,但是当整个集合呈现元素消失时,我仍然保留着空 View ,如 <div id="#carousel-inner"></div>
救命!
PS:我正在使用 bootstrap-carousel 来启用我的轮播
最佳答案
如果您使用的是 Marionette >= 2.0.0,则 itemView
已替换为 childView
。就目前而言,Marionette 的 CollectionView 类似乎没有 native itemView
属性。 the official docs 都没有提到它也不在 the source for the module .
此外,您在定义的容器元素的选择器中似乎存在错误:$('#carousel-inner')
正在查找具有 id 的元素carousel-inner
,但在生成的 html 中,顶级 div 将其作为一个类。
我觉得传递一个已经存在的元素可能会搞砸事情。即时制作自定义“el”可能会更好。我会尝试将标签渲染移动到 collectionView 中,如下所示:
View.CarouselItems = Marionette.CollectionView.extend({
childView: View.CarouselItem,
tagName: 'div',
//Add your custom classes to the div tag as soon as it's rendered
onRender: function(){
this.$el.addClass('carousel-inner');
}
});
然后在调用时,我会调用这样的内容:
var featuredItems = new View.CarouselItems({collection: content});
featuredItems.render().$el.appendTo(/*The DOM Node you'd like to append this to */);
关于javascript - Backbone.Marionette collectionview 在定义 el 时重置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27244321/