Backbone Tour--model Chapter

Backbone, as the front-end MVC framework, brings back-end design ideas to the front end, making the front-end code clearer and maintainable much better.

Backbone relies on underscore.js and jquery, so in the use of backbone must be introduced in these two commonly used JS library, jquery should be considered as standard web front-end, Undersocre is also a very common library, in Nodejs also used. There is a pit, three JS library references are in order, jquery, underscore, backbone must follow this order, and all the JS to be placed behind the body is the bottom of the page

Backbone consists of 4 main parts, Model, View, collections and router

Model: Very obvious data models

View: Display page

Collections: Loading a collection of model objects

Router: Front-end routing, this is very useful when implementing a single page application, very good control of the page jump and return

Next Study model

To define a simple model

var person = Backbone.Model.extend ({

URL: "/tt/save",

Initialize:function () {

Console.log ("Create person model");

This.bind ("Invalid", function (model, error) {

if (Error) {

Console.log (Error);

}

});

This.bind ("Change:name", function () {

var name = This.get ("name");
Console.log ("You changed the name attribute:" + name);

});

},

defaults:{

Name:null

},

Validate:function (attributes) {

if (attributes.name = = = "") {

Return "name cannot be empty";

}

}

});

var person = new person;//instantiates a person object so that a simple model object is completed

Initialize: Is the constructor

Defaults: The default property of the shape, you can also use Person.set ({});

Validate: Is to verify the properties of the model, but must listen to invalid, and only when the model execution save can be triggered, but if you want to set the time to execute, then you need

Person.set ({}, {"Validate": true}), so that it is triggered manually, in the execution of set is triggered

Change: This will know that the model property is triggered when the set is changed.

URL: This is a cool, model in the execution of the save when the data exchange with the server, is through the backbone.sync to achieve, in fact, is jquery Ajax, mainly focused on the corresponding request way,

Create, update, read, delete, will correspond to the HTTP request post, put, get, delete, so this place is need to use the restful format of the API (this oneself slowly see it),

The URL is configured in model, the default save is the Create (post) when the model without the initialization property is triggered, and if there is an initialization attribute it triggers an update (put), which needs to be noted when the backend is configured for routing.

Person.save ();//Will trigger create, and if present model triggers update,

Use fetch to customize the request, except that fetch triggers the read

Person.fetch ({

URL: "/tt/man",

Success:function (model, res) {},

Error:function () {

Console.log ("error");

}

});

The model is not very good to understand ........

Backbone Tour--model Chapter