Is there a rule of thumb to decide when to use trigger or triggerMethod in Backbone.Marionette?

Question

I'm playing a bit with Backbone.js and Backbone.Marionette and I would like to know what's the difference between trigger and triggerMethod.

In particular, is there any rule of thumb to decide when use the former or the latter?

In my mind events, for example, are useful to communicate between a DOM element and its view.

triggerMethod is used in Marionette to update in cascade different components, e.g. a layout calls the show method to its children (children respond to onShow). So, for me its the same as calling a direct method on it. Is this true?

What about trigger?

Thanks you in advance.

Answer 1

trigger(name)

• Part of Backbone.js
• Triggers event using the name passed in

triggerMethod(name)

• Part of Marionnete.js

• Does everything trigger(name) does

• Also calls methods using a predefined naming convention.

  eg. triggerMethod('foo') will call onFoo()

  eg. triggerMethod('foo:bar') will call onFooBar()

Answer 2

There isn't a huge difference, and it simply depends on what you want to do...

• trigger will trigger an event
• triggerMethod will trigger an event AND call a corresponding method according to naming convention (see https://marionettejs.com/docs/v2.1.0/marionette.functions.html#marionettetriggermethod)

Obviously, if you only want to trigger an event, you'd use trigger. But using trigger you also create a "home made" triggerMethod implementation: trigger the event, then have a listener that will call the function you want.

So what about triggerMethod ? As mentioned above, it will trigger an event and call a method. So if your only objective is to call the method in the first place, there isn't necessarily a need for using triggerMethod.

So why would one use triggerMethod at all? Because it gives you "hooks" to add functionality with event listeners. In my book on Marionette, for example, there is a triggerMethod call in https://github.com/davidsulc/marionette-gentle-introduction/blob/master/assets/js/apps/contacts/edit/edit_controller.js#L24 to display error messages on a form. The same could be achieved by simply calling

view.onFormDataInvalid(contact.validationError);

But as mentioned above, triggerMethod give us a "hook" for later use. For example, let's say I want to add logging of user errors: I can simply add a listener to my view:

initialize: function(){
  this.on("form:data:invalid", function(validationError){
    // log error here
  }
}

This additonal functionality can be added without impacting the rest of the code, because we've used triggerMethod instead of a direct method call. In addition, it will be easier to test later (small tests, with single point of failure):

• test that "form:data:invalid" event is triggered when a user enters incorrect info
• test that when "form:data:invalid" event is triggered, error gets logged
• etc.