Home > Developer > Web Develop
"Model is the core of the JS application, including the underlying data and the logic around it: Data transformation, validation, attribute calculation, and access control."
First, the method of initialization
Let's take a look at a demo,initialize, which is an initialization method, but before writing this code, we first import 3 corresponding library files in the
For example:
1<! DOCTYPE html>234<title>daomul forAxiba</title>56<body>7<script src= "Http://libs.baidu.com/jquery/1.10.2/jquery.min.js" ></script>8<script src= "Js/underscore.js" ></script>9<script src= "Js/backbone.js" ></script>Ten<script> One A(function($){ - //backbone extends instance methods and static methods through Extend: - //Initialize this initialization method, also called the constructor. This function is called when the model is instantiated. the varPeople =Backbone.Model.extend ({ - Initialize:function(){ -Alert (' Hi, I am daomul! ')); - } + }); - varperson =Newpeople; + }) (jQuery); A at</script> -</body> -Second, defaults and object assignment methods get and set
A property exists in a dictionary (or similar dictionary) in a model, and the default value is set by a method that implements the defaults of the backbone, or assigns a value to defaults.
1(function($){2 3 varPeople =Backbone.Model.extend ({4 Initialize:function(){5Alert (' Come on! '));6 },7 defaults: {8Name: ' Daomul ',9Age: ' 24 'Ten } One }); A - varperson =Newpeople; - the //Get Gets the value of the object -Alert (person.Get(' Age ')); - - //set changes the value of an object +Person.Set({phone: ' 134133 ', Sex: ' Male ')}); -Alert (person.Get(' Sex ')); + A}) (JQuery);Third, the custom method in the object
The custom method in the model can be found to be constructed by means of a dictionary, and the invocation of the method can be manipulated through the. Syntax.
1(function($){2 3 varPeople =Backbone.Model.extend ({4 Initialize:function(){5 6 },7 defaults: {8Country: ' China '9 },Ten Myprivatemethod:function(){ One return' I \ ' m from ' + This. Get (' country ') + ' and my name \ ' s ' + This. Get (' name '); A } - }); - the varperson =Newpeople; -Person.Set({name: ' Axiba ')}); - alert (person. Myprivatemethod()); - +}) (JQuery);Iv. changes in the properties of the binding listener object
By this.bind the change of the property value in the Listener object, the change is defined by the Change:name and the format of the dictionary.
1(function($){2 3 varPeople =Backbone.Model.extend ({4 Initialize:function(){5Alert (' 1 ');6 //Binding Monitoring7 This.Bind(‘Change:name‘,function(){8 varName = This. Get (' name ');9Alert (' Oh, no u change my name to ' +name);Ten }); One }, A defaults : { -Name: ' Axiba ', -Age: ' 100 ' the } - }); - - varperson =Newpeople; +Person.set ({name: ' Axiba2 ')}); - +}) (JQuery);V. Validation rules and tips for errors
The following demo shows that there are three ways to trigger the validation of a value change:
1(function($){2 varPeople =Backbone.Model.extend ({3 4 Initialize:function(){5 This.Bind("Invalid",function(model,error) {6 alert (error);7 });8 },9 defaults: {TenName: ' Axiba ', OneAge:11 A }, - Validate:function(attributes) { - the if(Attributes.name = = "") { - return"Name cannot be empty!" "; - } - } + }); - + varperson =Newpeople; A at //Method 1: The default set is not validated, and validation is triggered when save. The error message pops up according to the validation rules. - //Person.set ({name: '}); - //Person.save (); - - //Method 2: Trigger The validation manually, set will trigger - //Person.set ({name: '}, {' Validate ': true}); in - //Method 3: Add error handling also OK toPerson.on ('Invalid‘,function(model, error) { + alert (error); - }); thePerson.set ({name: ""}); * Person.save (); $ Panax Notoginseng}) (jQuery); */Backbone.js model article (1) Simple example
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
