从集合中删除模型时,Marionette CollectionView会重新渲染

时间:2013-09-09 13:13:19

标签: backbone.js marionette

我想出了我的问题,但我想知道为什么,以便我(希望)更好地理解Marionette /骨干。

问题以下代码会在删除项目时更新视图:

var MainView = Marionette.ItemView.extend({
    template: "#sample-template",
    events :{
        "click #remove" : "remove"
    },
    remove: function(){            
        this.trigger("property:remove", this.model);
    }
});
var CollectionView = Marionette.CollectionView.extend({
    itemView: MainView,
    initialize: function(){
        this.on("itemview:property:remove", function(view, model){
            alert(this.collection.length);
            this.collection.remove(model);
            alert(this.collection.length);
        });
    }
});

A JsFiddle to view in all its glory

修复以下代码确实按预期更新了视图:

var MainView = Marionette.ItemView.extend({
    template: "#sample-template",
    triggers :{
        "click #remove" : "property:remove"
    },
});

var CollectionView = Marionette.CollectionView.extend({
    itemView: MainView,
    initialize: function(){
        this.on("itemview:property:remove", function(view, model){
            alert(this.collection.length);
            this.collection.remove(view.model);
            alert(this.collection.length);
        });
    }
});

The jsFiddle

2 个答案:

答案 0 :(得分:5)

Backbone.View定义了一个名为remove的方法,用于从DOM中删除视图。您的第一个示例将覆盖该方法。

如果将remove重命名为removeIt,则名称冲突将消失,代码将按预期工作。对于它的价值,我认为第二种方法无论如何都适用于这种情况。

答案 1 :(得分:3)

对于遇到此问题的人,请记住,Marionette 2.x将itemview更改为childview。把我绊了一下。干杯!