The Backbone.js mixin Collection is function which is used to append attributes and function to base Backbone.Collection class. This function is used add generic function link Underscore Method.
Syntax:
Backbone.Collection.mixin( properties );
Properties: It accepts a single property as mentioned above and described below:
- properties: It is the properties which we want to append in our base class.
In the below examples, we will use the Backbone.js mixin Collection.
Example 1: In this example, we will append some attributes and initialize method which will print itself.
HTML
<!DOCTYPE html> < html > < head > < script src = type = "text/javascript" > </ script > < script src = type = "text/javascript" > </ script > < script src = type = "text/javascript" > </ script > </ head > < body > < h1 style = "color: green;" > neveropen </ h1 > < h3 >BackboneJS mixin Collection</ h3 > < script type = "text/javascript" > Backbone.Collection.mixin({ Collection_Name: 'Books', Collection_size: 1000, initialize: function () { document.write( "Mixin append < br > collection : ", JSON.stringify(this) ); }, }); var geek = new Backbone.Collection(); </ script > </ body > </ html > |
Output:
Example 2: In this example, we will add print method to the base class which will print given attribute of model in class.
HTML
<!DOCTYPE html> < html > < head > < script src = type = "text/javascript" > </ script > < script src = type = "text/javascript" > </ script > < script src = type = "text/javascript" > </ script > </ head > < body > < h1 style = "color: green;" > neveropen </ h1 > < h3 >BackboneJS mixin Collection</ h3 > < script type = "text/javascript" > Backbone.Collection.mixin({ print: function (models, iter) { return _.map(models, function (a, b) { document.write(a.get(iter), "< br >") }) }, }); var geek = new Backbone.Collection([ { author: "Narayana Murthy", title: 'A Better India : A Better World' }, { author: "Amrita Pritam", title: 'A Revenue Stamp' }, { author: "Lewis Carroll", title: 'Alice in the Wonderland' }]); geek.print('title') </ script > </ body > </ html > |
Output:
Reference: https://backbonejs.org/#Collection-mixin