1

嗨,我对backbone.js 有点陌生

有没有办法从集合中删除一个项目(并且只是那个项目)并且不必刷新列表。相反,仅从视图和集合中删除该项目,并且视图集合不会发生刷新/重新渲染。或者甚至有可能吗?

这是我的代码片段:

var DateModel = Backbone.Model.extend({
    defaults: function() {
        return {
            index: '',
            valueFrom: '',
            valueTo: '',
            status: '',
            showText: '',
            text: ''
        }
    },
});

var DateList = Backbone.Collection.extend({
    model: DateModel
});

var dateList = new DateList();

var DateView = Backbone.View.extend({
    model: new DateModel(),
...
});

var DateListView = Backbone.View.extend({
    model: dateList,
    el: $('#date-list-container'),
    initialize: function() {
        this.listenTo(this.model, 'add', this.render);
        this.listenTo(this.model, 'remove', this.render);
        this.listenTo(this.model, 'reset', this.render);
    },
    render: function() {
                // code for rendering here...
                _.each(this.model.models, function(date){...});
            }
 });
4

1 回答 1

1

您可以通过将事件侦听器更改this.render为自定义侦听器函数来执行此操作,该函数接收作为参数删除的模型,而不是重新渲染整个视图,只需从视图中删除表示该模型的 HTML 元素。这样,您不必总是重新渲染整个视图,这可能会很昂贵,而只需更改已更改的部分。

例如,这一行:

this.listenTo(this.model, 'remove', this.render);

将被替换为接收remove事件参数的不同事件处理函数:

remove (model, collection, options) — 当模型从集合中移除时。

所以你可能有一个事件监听器函数,比如:

modelRemoved: function(model, collection, options) {
  // code to find the HTML element for 'model' and remove it from the DOM
}

然后将其用作删除事件的事件处理程序:

this.listenTo(this.model, 'remove', this.modelRemoved);
于 2013-04-09T05:36:19.217 回答