Backboneを知っています

7531 ワード

Backbone.Model(モデル)
ModelsはいかなるJavascriptアプリケーションの核心であり、データインタラクションとそれに関連する大量の論理:変換、検証、計算属性とアクセス制御を含む.ModelはBackboneの中でデータモデルで、最も基本的なデータベースです.
モデルオブジェクトを作成
exted  Backbone.Model.extend(properties, [classProperties]) 
var World = Backbone.Model.extend({
     initialize: function(){
        console.log('     model  ')
     }
});
var world = new World()
 属性(データ)の設定と取得
get  model.get(attribute) 現在のmodelから現在の属性値を取得します.
セット  model.set(attributes, [options]) modelに1つ以上のhash属性を設定します.いずれかの属性がmodelの状態を変えたら、オプションパラメータが入ってこない場合にトリガされます. 「change」 イベントは、特定の属性を変更するイベントもトリガされます.
var World = Backbone.Model.extend({
    defaults: {
        name: 'lbs',
        age: 10
    },
    initialize: function(){
        console.log('     model  ')
    }
});
var world = new World()
console.log( world.get('age') ) //10
world.set({'age':50})
console.log( world.get('age') ) //50
カスタム方法 
var World = Backbone.Model.extend({
    defaults: {
        text: 'hello, world!'
    },
    say: function(){
        console.log( this.get('text') )
    }
});
var world = new World()
world.say() //hello, world!
属性値の変化を待ち受けます.   
var World = Backbone.Model.extend({
    defaults: {
        name: 'lbs',
        age: 10
    },
    initialize: function(){
        this.on('change:name',function(model,value){
            var oldname = model.previous('name');
            console.log('      :'+ oldname +' ,      :' + value)
        })
    }
});
var world = new World()
world.set({'name':'ccx'}) //      :lbs ,      :ccx
データ検証 
   validate  model.validate(attributes, options) 
var World = Backbone.Model.extend({
    defaults: {
        name: 'lbs',
        age: 10
    },
    initialize: function(){
        this.on('invalid',function(model,error){
            console.log(error);
        });
    },
    validate: function (attrs) {
        if( !_.isString(attrs.name) ) return '        ';
        if( !_.isNumber(attrs.age) ) return '       ';
    }
});
var world = new World()
//      (v1.0.0) {validate:true} 
world.set({name:'ccx',age: 'three'},{validate:true}) //       
    setメソッドを呼び出した場合、validateをtrueとし、データ検証をオンにし、validateをtrueまたは設定silentをtrueとしないで、データ検証をオフにします.
属性(データ)の削除
unset  model.unset(attribute, [options]) 内部属性分散リストから指定属性を削除します.未設定の場合 シンプル オプションを選択すると、「change」がトリガされます. イベント
clear  model.clear([options]) id属性を含むすべての属性をmodelから削除します.未設定の場合 シンプル オプションを選択すると、トリガーされます 「change」イベント.    
var World = Backbone.Model.extend({
    defaults: {
        name: 'lbs',
        age: 10
    }
});
var world = new World()
world.unset('name')
console.log( world.get('name') )  //undefined
world.set({name:'ccx'})
console.log( world.get('name') ) //ccx
console.log( world.get('age') ) //10
world.clear()
console.log( world.get('name') )  //undefined
console.log( world.get('age') )  //undefined
 属性操作
atributes  model.attributes atributes 属性は、モデル状態を含む内部分散リストです.  
var World = Backbone.Model.extend({
    defaults: {
        name: 'lbs',
        age: 10
    }
});
var world = new World()
console.log( world.attributes ) // Object {name: "lbs", age: 10}
 previous  model.previous(attribute) はい、 「change」 イベントが発生している間、本方法は、変更された属性の古い値を取得するために使用されてもよい.
 previous Attributes  model.previousAttributes() モデルの前の属性のコピーを返します.モデルの異なるバージョンの違いを取得するために一般的に使用されます.またはエラーが発生した場合はロールバックモデル状態です.
var World = Backbone.Model.extend({
    defaults: {
        name: 'lbs',
        age: 10
    }
})
var world = new World()
world.on('change:name',function(model,value){
    var oldname = model.previous('name');
    var newname = model.get('name');
    console.log('      :'+ oldname +',      :'+ newname);
})
world.on('change:age',function(model,value){
    var attrs = model.previousAttributes();
    var oldage = attrs.age;
    console.log('      :'+ oldage +',      :'+ value)
})
world.set({name:'ccx'}) //      :lbs,      :ccx
world.set({age: 50}) //      :10,      :50
 データを同期
   保存する  model.save([attributes], [options]) Backbone.syncに委託することで、モデルをデータベースに保存する(送信されたクライアントデータをサーバに保存する)
var World = Backbone.Model.extend({
    url: 'backbone-test.php',
    defaults: {
        name: 'lbs',
        age: 10
    }
})
var world = new World()
world.set({name:'ccx',age: 50})
//world.save()
world.save(null,{
    success: function(model,response){
        console.log( response.code )
    }
})

//php  

//         
header('Content-Type: application/json; charset=utf-8'); 
//              
$data = json_decode(file_get_contents("php://input"));
/*
        ,       
*/
//         
die(json_encode(array('code'=>'0')));
 fetch  model.fetch([options]) Backbone.syncに委託してサーバからモデルをリセットした状態(サーバのデータを取得)
var World = Backbone.Model.extend({
    url: 'backbone-test.php',
    defaults: {
        name: 'lbs',
        age: 10
    }
})
var world = new World()
world.fetch({
    success: function(model,response){
        console.log( world.toJSON() ) //Object {name: "ccx", age: 20, code: 1}
    },
    error: function(error){
        console.log( error )
    }
})

//php  
$json = array('name'=>'ccx','age'=>20,'code'=>1);  
echo json_encode($json);
 デストロイ  model.destroy([options]) Backbone.syncに委託して、モデルをデータベースに保存します.
destroy方法を起動すると、DELETE要求でサーバに対象のIDデータを送信し、サーバはデータを受信して対応するデータレコードを削除し、削除成功のフラグをクライアントに送信する.
var World = Backbone.Model.extend({
    url: 'backbone-test.php',
    defaults: {
        name: 'lbs',
        age: 10
    },
    idAttribute: 'code'
})
var world = new World({
    'code': 110
})
world.destroy({
    success: function(model,response){
        if(response.code == '0'){
             console.log( model.get('code') +'      ' )  // 110       
        }
    },
    error: function(error){
        console.log( error )
    },
    wait: true
})

//php  
echo json_encode(array('code'=>0));