Backbone Cheat Sheet
Model and View References
In general, when starting with Backbone it is advised to have a 1-1 correlation of models to views. Every Collection should have a “Collection View” which is simply a Backbone View. Taking a quote from the Backbone website you can see there are 3 distinct approaches people take to matching up Models and Views.References between Models and Views can be handled several ways. Some people like to have direct pointers, where views correspond 1:1 with models (model.view and view.model). Others prefer to have intermediate “controller” objects that orchestrate the creation and organization of views into a hierarchy. Others still prefer the evented approach, and always fire events instead of calling methods directly. All of these styles work well.
View Guidelines
- Every Backbone Collection should have a Collection View.
- Collection Views are just regular views that should render no HTML.
- The Collection View should listen to the add, remove, and reset Collection events.
- Views handle model events and DOM events to drive their behavior.
Tips
- In your view’s render() function you should “return this;” to enable chained calls.
- Provide a defaults object to your Backbone Model to make the model easier to understand.
View Event Options
- change
- focusout
- mousedown
- mouseover
- select
- click
- hover
- mouseenter
- mouseup
- unload
- dbclick
- keydown
- mouseleave
- ready
- focus
- keypress
- mousemove
- resize
- focusin
- load
- mouseout
- scroll
Collection Events
- add - a model is added
- remove - a model is removed
- reset - reset or fetch is called on collection
Model Events
- change
- change:[attribute]
- destroy
- sync
- error
- all
Model and Collection Functions
- initialize - if provided it will be called when constructing the model