Backbone.js 如何使用删除方法？

在我的主干函数中，如何在添加新元素之前删除元素？我的函数都可以正常工作。问题是，当我点击“更新”时，它正在更新元素，并且仍然是旧版本。如何删除旧元素，并从更新调用中追加新元素

清除现有视图元素和附加新集合的正确方法是什么？

我的职能：

$(document).ready(function(){

    var school = {};

    school.model = Backbone.Model.extend({
        defaults:{
            name:'no name',
            age:'no age'
        }
    });

    school.collect = Backbone.Collection.extend({
        model:school.model,
        url:'js/school.json'
    });

    school.view = Backbone.View.extend({
        tagName:'div',
        className:'member',
        template:$('#newTemp').html(),
        render:function(){
            var temp = _.template(this.template);
            this.$el.html(temp(this.model.toJSON()));
            return this;
        }
    });

    school.views = Backbone.View.extend({
        el:$('#content'),
        events:{
            'click #newData' : 'newArrival',    
        },
        initialize:function(){
            _.bindAll(this);
            this.collection = new school.collect;
            this.collection.bind('reset', this.render);
            this.collection.fetch();
        },
        newArrival:function(){
            school.views.remove(); // i tried this, throw the error 
            this.initialize();
        },
            render:function(){
                var that = this;
                _.each(this.collection.models, function(item){
                    that.renderItem(item);    
                })
            },
            renderItem:function(item){
                //how can i remove the older elements and append new alone?
                var newItem = new school.view({model:item});
                this.$el.append(newItem.render().el); // keep adding but previous element still not removed, 
            }
        });

        var newSchool = new school.views;

})

---

您需要有对旧视图的引用才能删除它们。然后，您将能够在子视图上调用remove。我强烈建议您使用backbones remove方法，而不是使用jquery从DOM中删除元素。使用Backbones remove还将解除对象中事件的绑定。要从服务器进行更新，只需调用collection.fetch（）来获取新数据。这是我的解决方案（底部是JSFIDLE）：

---

我已创建一个工作组：。注意：在JSFIDLE集合中，我覆盖fetch（）以提供假数据（您应该删除该部分）。

我尝试过这种方法，这是正确的方法吗？我的newArraival函数添加了一行。。这个.el.find（'div'）.remove（）；它能工作！您应该使用主干删除方法（请参阅下面的答案）。它将负责正确地破坏视图。此.el.find（'div'）.remove（）仅使用jquery从DOM中删除div元素（不会删除主干事件侦听器）。我建议大家看一下主干网。木偶网，这是一个主干网扩展，它解决了事件绑定、集合视图等方面的许多问题。我按照您的建议进行了更新，但它仍然没有被删除。我已经更新了代码，添加了一个JSFIDLE，并通过collection.fetch（）进行了更新；它起作用了。我刚刚删除了fetch函数来处理json数据。谢谢

var school = {};

school.model = Backbone.Model.extend({
    defaults:{
        name:'no name',
        age:'no age'
    }
});

school.collect = Backbone.Collection.extend({
    model:school.model,
    url:'js/school.json'
});

school.view = Backbone.View.extend({
    tagName:'div',
    className:'member',
    template:$('#newTemp').html(),
    render:function(){
        var temp = _.template(this.template);
        this.$el.html(temp(this.model.toJSON()));
        return this;
    }
});

school.views = Backbone.View.extend({
    el:$('#content'),
    events:{
        'click #newData' : 'newArrival',    
    },
    initialize:function(){
        _.bindAll(this);
        this.collection = new school.collect;
        this.collection.bind('reset', this.render);
        this.collection.fetch();

        this.childViews = [];
    },
    newArrival:function(){
        this.collection.fetch();
    },
    render:function(){
        var that = this;

        // Remove old items
        _.each(this.childViews, function(old){
            old.remove();    
        });

        // Empty array of children
        this.childViews = [];

        var that = this;
        _.each(this.collection.models, function(item){
            that.renderItem(item);    
        });
    },
    renderItem:function(item){
        //how can i remove the older elements and append new alone?
        var newItem = new school.view({model:item});
        this.$el.append(newItem.render().el); // keep adding but previous element still not removed, 

        // Store a reference to your child item.
        this.childViews.push(newItem);
    }
});

var newSchool = new school.views;