Как найти, какое событие было запущено в коллекции

Question

У меня была коллекция под названием одобрений, на которой у меня было событие по синхронизации и удалению типов событий коллекции в renderRows. проверьте ниже код Мне нужно сбросить текущую коллекцию на основе события удаления коллекции утверждения.

this.approvals.on("sync delete", this.renderRows, this); 

function renderRows(model, e, event) { 
    //some code 
    if (event.type == "delete") { 
      this.collection.reset(); 
    } 
} 

Но я получаю мероприятие как undefined. Не могли бы вы дать мне знать, как получить event.type для коллекций.

Answer 1

Имя события не передается, если только оно не было специально передано как arg, например. a trigger('sync', 'sync'). Поэтому вы можете либо проверить аргументы (потому что они разные в зависимости от события в этом случае, я думаю), но это плохая идея, потому что они могут меняться, и это делает ваш код хрупким. Лучше всего, чтобы просто разбить его:

this.listenTo(this.approvals, "sync", this.onApprovalSync); 
this.listenTo(this.approvals, "delete", this.onApprovalDelete); 

onApprovalSync: function() { 
    this.renderRows(); 
} 

onApprovalDelete: function() { 
    this.collection.reset(); 
    this.renderRows(); 
} 

Answer 2

У вас также есть этот вариант:

this.listenTo(this.approvals, 'sync', _.partial(this.renderData, 'sync')); 
this.listenTo(this.approvals, 'delete', _.partial(this.renderData, 'delete')); 

и renderData (или же вы хотите назвать это) получают один дополнительные параметры, которые вы передаете с _.partial (карри)

renderData: function(eventName, collection, resp, options) {} 

это метод подпись: http://backbonejs.org/docs/backbone.html#section-133 collection.trigger('sync', collection, resp, options); удаление выглядит же

Похоже, это как простой пример: (косяк делать delete, но я могу вызвать change, просто подождите 5 секунд)

var Model1 = Backbone.Model.extend({ 
    url: 'http://jsonplaceholder.typicode.com/posts/1' 
}); 

var View1 = Backbone.View.extend({ 
    template: _.template('<%= eventName %> - <%= body %>'), 
    initialize: function() { 
     // render something as soon as possible 
     this.render(); 

     this.model = new Model1(); 
     this.listenTo(this.model, 'sync', _.partial(this.renderData, 'sync')); 
     this.listenTo(this.model, 'change', _.partial(this.renderData, 'change')); 
     this.model.fetch(); 

     // to test it 
     setTimeout(_.bind(function(){this.model.set('body', 'it was changed')}, this), 5000); 
    }, 
    // this is the normal sync/change function signature only with one extra param `eventName` 
    // which is being `curry`'ed in 
    renderData: function(eventName, model, resp, options) { 
     this.$el.html(this.template({ 
      'eventName': eventName, 
      'body': model.get('body') 
     })); 
     return this; 
    }, 
    render: function() { 
     this.$el.html('nothing to see here'); 
     return this; 
    } 
}); 

new View1({el: $('body').append($('<div>'))}); 

Выполнить его здесь: http://jsfiddle.net/tLaLykk8/

Answer 3

Из того, что я понял, вы хотите иметь общий обработчик для событий sync и remove и хочет определить, какое событие вызвало обработчик.

После подписания обратных вызовов этих событий различны:

remove: (model, collection, options) и sync: (model_or_collection, resp, options)

Мы можем добиться этого путем проверки типа аргументов, переданных в обработчик, как показано ниже:

var View = Backbone.View.extend({ 
 
    initialize: function() { 
 
    this.listenTo(this.collection, 'sync', this.dosomething); 
 
    this.listenTo(this.collection, 'remove', this.dosomething); 
 

 
    this.render(); 
 
    }, 
 
    events: { 
 
    'click #remove': 'triggerRemove', 
 
    'click #sync': 'triggerSync', 
 
    }, 
 
    render: function() { 
 
    this.$el.html('<button id="remove">Trigger remove</button><button id="sync">trigger sync</button>').appendTo('body'); 
 
    return this; 
 
    }, 
 
    triggerRemove: function() { 
 
    var model = this.collection.add({ 
 
     name: 'test' 
 
    }); 
 
    this.collection.remove(model); 
 
    }, 
 
    triggerSync: function() { 
 
    this.collection.trigger('sync'); 
 
    }, 
 
    dosomething: function(model) { 
 
    if (arguments[1] instanceof Backbone.Collection) //second argument is a collection 
 
     console.log('remove triggered') 
 
    else 
 
     console.log('sync triggered') 
 
    } 
 
}); 
 
var view = new View({ 
 
    collection: new Backbone.Collection([{ 
 
    name: 'hi' 
 
    }, { 
 
    name: 'hellow' 
 
    }]) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.2.3/backbone-min.js"></script>