原文連結: http://docs.sencha.com/touch/2-0/#!/api/Ext.data.Model
一個模型(Model)就代表着你應用中管理的某個對象。比如說,一個人可能定義了一個模型來代表使用者(Users),産品(Product),汽車(Cars)或者任意其他現實世界中我們想用模型來表示的對象。模型通過modelmanager注冊,并被stores使用。而stores反過來又被Ext中許多綁定資料的元件所使用。
模型被定義為一系列字段(fields)以及任意和模型相關的方法和屬性的集合。比如: Ext.define('User',{ extend: 'Ext.data.Model', config: { fields:[ {name: 'name', type: 'string'}, {name: 'age', type: 'int'}, {name: 'phone', type:'string'}, {name: 'alive', type:'boolean', defaultValue: true} ] },
changeName: function() { varoldName = this.get('name'), newName = oldName + " TheBarbarian";
this.set('name', newName); } }); 這個字段數組自動的被 ModelManager轉化為一個MixedCollection,并且所有其他的函數和屬性被複制到新模型的原型中。
現在我們可以建立我們的User模型的執行個體并執行我們定義在其中的任意邏輯: var user = Ext.create('User',{ name : 'Conan', age : 24, phone: '555-555-5555' });
user.changeName(); user.get('name'); //returns"Conan The Barbarian"
Validations 模型有對驗證的内嵌支援, 并且是通過Ext.data.validations (seeall validation functions)中的驗證器函數來執行的。驗證可以很容易的加到模型中: Ext.define('User',{ extend:'Ext.data.Model',
config: { fields: [ {name:'name', type:'string'}, {name:'age', type: 'int'}, {name:'phone', type:'string'}, {name:'gender', type: 'string'}, {name:'username', type: 'string'}, {name:'alive', type: 'boolean',defaultValue: true} ],
validations: [ {type:'presence', field: 'age'}, {type:'length', field: 'name', min: 2}, {type:'inclusion', field: 'gender', list: ['Male','Female']}, {type:'exclusion', field: 'username', list: ['Admin', 'Operator']}, {type:'format', field: 'username',matcher: /([a-z]+)[0-9]{2,3}/} ] } }); 驗證可以簡單地通過調用 validate函數來執行。該函數傳回一個 Ext.data.Errors對象: var instance =Ext.create('User', { name: 'Ed', gender: 'Male', username: 'edspencer' });
var errors =instance.validate();
Associations
模型可以和其他的模型通過Ext.data.association.HasOne, belongsTo 以及hasMany的關系建立對應關系。例如,假設我們正在寫一個部落格的管理應用,要處理的項包括Users,Posts 以及 Comments。這些模型之間的關系我們可以這樣來表達: Ext.define('Post',{ extend: 'Ext.data.Model',
config: { fields: ['id','user_id'], belongsTo: 'User', hasMany :{model: 'Comment', name: 'comments'} } });
Ext.define('Comment', { extend: 'Ext.data.Model',
config: { fields: ['id', 'user_id','post_id'], belongsTo: 'Post' } });
Ext.define('User', { extend: 'Ext.data.Model',
config: { fields: ['id'], hasMany: [ 'Post', {model: 'Comment', name: 'comments'} ] } }); 可以參看 Ext.data.association.HasOne , Ext.data.association.BelongsTo and Ext.data.association.HasMany的文檔來了解 關系的應用以及配置的更多細節。注意,關系也可以像下面這樣指定: Ext.define('User', { extend:'Ext.data.Model',
config: { fields: ['id'], associations: [ {type:'hasMany', model: 'Post', name: 'posts'}, {type:'hasMany', model: 'Comment', name: 'comments'} ] } });
應用一個代理(Using a Proxy)
模型可以很好的代表資料和關系的類型,但是我們早晚要在某個地方想要去加載或者儲存那些資料。加載和儲存資料都是通過一個 Proxy,他可以在Model中直接配置: Ext.define('User', { extend:'Ext.data.Model',
config: { fields: ['id', 'name', 'email'], proxy: { type:'rest', url :'/users' } } }); 這裡我們已經設定了一個 RestProxy,它知道怎樣從後端加載資料以及如何儲存資料到後端。讓我們看看這是如何做到的: var user = Ext.create('User', {name: 'Ed Spencer', email:'[email protected]'}); user.save(); //POST /users 通過調用新的模型執行個體的save方法來告訴配置好了的 RestProxy我們希望把我們模型的資料存儲在伺服器上。 RestProxy指出這個模型之前沒有被儲存過因為它沒有id,并執行适當的操作--在這種情況下發送一個POST請求到我們配置好的url (/users) 。我們可以在任意的模型上配置任意的 Proxy并總是要遵從這個API--參見 Ext.data.proxy.Proxy來擷取完整的清單。 通過一個代理來加載資料也是很容易的: //get a reference to the User model class var User = Ext.ModelManager.getModel('User');
//Uses the configured RestProxy to make a GET request to/users/123 User.load(123, { success: function(user){ console.log(user.getId()); //logs 123 } }); 模型也可以很容易的進行更新和銷毀: //the user Model we loaded in the last snippet: user.set('name', 'Edward Spencer');
//tells the Proxy to save the Model. In this case it willperform a PUT request to /users/123 as this Model already has anid user.save({ success: function(){ console.log('The User was updated'); } });
//tells the Proxy to destroy the Model. Performs a DELETErequest to /users/123 user.erase({ success: function(){ console.log('The User was destroyed!'); } });
Stores的使用(Usage in Stores)
我們想要下載下傳一系列的模型執行個體并在UI中展示和操作是很常見的。我們通過一個Store來建立: var store = Ext.create('Ext.data.Store', { model: 'User' });
//uses the Proxy we set up on Model to load the Storedata store.load(); 一個Store僅僅是一個Model執行個體的集合--通常是從某個地方的伺服器下載下傳的。Store也可以通過一系列的增加,更新和移除Model執行個體來通過Proxy與伺服器保持同步。可以參看 Storedocs來了解關于Store的更多資訊。