javascript - 主干 - 为什么 collection.reset 不触发模型事件？

Question

我很想知道为什么重置 Backbone 集合不会触发模型事件。但是，当模型从集合中物理移除时触发模型事件似乎是合乎逻辑的。

这是故意的还是我遗漏了什么？如果 backbone 不做这种事情，那么委托(delegate)这样的事件是一个很好的做法。

为什么 backbone 在其集合重置时不触发模型事件？

var TicketModel = Backbone.Model.extend({
    defaults: {
        name: 'crafty',
        email: 'dwq@dwqcqw.com'
    },
    initialize: function(){
        this.on("all", function(event){
            console.log(event)
        });
    }

});

var TicketCollection = Backbone.Collection.extend({
    model: TicketModel,

    });


var tickets = new TicketCollection([
    {
        name: 'halldwq'
    },
    {
        name: 'dascwq'
    },
    {
        name: 'dsacwqe'
    }

]);

tickets.reset();

Answer 1

这是主干重置功能:

reset: function(models, options) {
  models  || (models = []);
  options || (options = {});
  for (var i = 0, l = this.models.length; i < l; i++) {
    this._removeReference(this.models[i]);
  }
  this._reset();
  this.add(models, _.extend({silent: true}, options));
  if (!options.silent) this.trigger('reset', this, options);
  return this;
},

我们可以忽略最后 3 行，因为您没有为重置函数提供任何模型。我们也忽略前两行。所以首先我们遍历这个集合中的模型并调用集合的 _removeReference(model) 方法，它看起来像这样:

_removeReference: function(model) {
  if (this == model.collection) {
    delete model.collection;
  }
  model.off('all', this._onModelEvent, this);
},

这里发生的是，我们从模型对象中完全删除了集合属性，同时也删除了对该模型事件的绑定(bind)。接下来我们调用集合的 _reset() 函数，如下所示:

_reset: function(options) {
  this.length = 0;
  this.models = [];
  this._byId  = {};
  this._byCid = {};
}, 

它只是彻底删除了对集合曾经拥有的任何模型的任何引用。

我们能从中得到什么？好吧，Backbone 中的集合 reset - 函数基本上只是绕过了所有删除模型的官方 channel ，并且在保密的情况下完成这一切，除了 reset 之外没有其他事件被触发.因此，您想为重置期间从集合中移除的每个模型触发模型的 remove 事件吗？简单!只需像这样覆盖 Backbone.Collection 的重置函数:

var Collection = Backbone.Collection.extend({
  reset: function(models, options) {
    models  || (models = []);
    options || (options = {});

    for (var i = 0, l = this.models.length; i < l; i++) {
      this._removeReference(this.models[i]);
      // trigger the remove event for the model manually
      this.models[i].trigger('remove', this.models[i], this);
    }

    this._reset();
    this.add(models, _.extend({silent: true}, options));
    if (!options.silent) this.trigger('reset', this, options);
    return this;
  }
});

希望这对您有所帮助!