sencha touch之模型(model)

模型的实例相当于数据库中表的一条记录。

一般模型在\app\model下创建，而且必须遵守类的命名规则，也就是可以根据类名找到模型的定义文件。

所有模型类都要从Ext.data.Model或Ext.data.model的子类派生。

一个典型的模型：

Ext.define("FirstApp.model.Product", {

extend: 'Ext.data.Model',

requires:[
'Ext.tux.proxy.Format'
],

config: {
fields:[
{name: "ProductId" , type: "int"},
"ProductName",
{name: "Price" , type: "float" ,defaultValue: 0.00},
{name: "Stock" , type: "int" ,defaultValue: 0}
],
validations:[
{type: "presence" ,field: "ProductName"}
],
associations:[
{type: "hasMany" , model: "FirstApp.model.Comment" }
],
idProperty:"ProductId",
proxy:{
type: 'format',
api:{
read: "data/product.json",
destroy: "data/product.asp"
}
}
}
}); store中，模型必须有一个唯一的id来定位模型实例，如果模型中没有定义，就会默认创建一个id字段，而且它的值是Ext.id方法生成的唯一id值。 添加验证：Ext.data.validations验证模型数据是否符合要求验证类型有：presencelengthformatinclusionexclusion

Validations

Models have built-in support for validations, which are executed against the validator functions in Ext.data.validations (see all validation functions). Validations are easy to add to models:

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}/}
        ]
    }
});

The validations can be run by simply calling the validate function, which returns a Ext.data.Errors object:

var instance = Ext.create('User', {
    name: 'Ed',
    gender: 'Male',
    username: 'edspencer'
});

var errors = instance.validate();

模型之间的关系：类似于表与表之间的关系 模型中定义关系有四种：association：用来定义任何关系belongTo：可以定义多对一关系hasMany：可以用来定义一对多关系hasOne：可以定义一对一关系 产品对于评论来说是一对多关系， 反过来是多对一关系定义关系时,模型的名称必须是类名的全称，如果外键不是模型名加上_id，例如product_id，那么外键必须使用foreignKey来指定。

Ext.define('User', {
    extend: 'Ext.data.Model',

    config: {
        fields: ['id'],
        associations: [
            {type: 'hasMany', model: 'Post',    name: 'posts'},
            {type: 'hasMany', model: 'Comment', name: 'comments'}
        ]
    }
});

模型的定义

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() {
        var oldName = this.get('name'),
            newName = oldName + " The Barbarian";

        this.set('name', newName);
    }
});

模型的使用

var user = Ext.create('User', {
    name : 'Conan',
    age  : 24,
    phone: '555-555-5555'
});

user.changeName();
user.get('name'); // returns "Conan The Barbarian"

模型代理

代理就像一座桥梁，为模型或者store提供不同的数据源，配合Reader和Writer去读取或者保存数据。

根据数据源的不同分为本地代理和远程代理。

远程代理则是使用Ajax技术来处理数据。远程代理也就是使用Ext.data.proxy.Ajax，使用Ajax代理。

从Ext.data.proxy.Ajax中派生来了Ext.data.proxy.Rest代理，但是里面还是使用Ajax来请求处理。

要在模型中使用代理，就要设置proxy配置项，它的值为配置对象，

proxy:{
    type: 'format',
    api:{
        read: "data/product.json",    // 服务器端一般是按照json格式返回数据
        destroy: "data/product.asp"
    }
}

要提交数据，必须要有地址，这里有两种定义方式，一种是使用url来定义，另一种是使用api。

使用url只能定义获取数据的方式，而不能编辑，删除和创建等操作。

配置项api的值是一个对象，包含create、read、update和destroy这4个配置项，分别对应新建、读取、更新和删除4个操作

服务器端一般是按照json格式返回数据，那么如何将json转变为模型的实例呢？

答曰：使用Reader

Read的作用是根据返回的数据格式，将返回的数据转换为模型实例存储到store中。

数据的格式有数组，JSON和XML这三种格式，因而对应的有

Ext.data.reader.Array

Ext.data.reader.Json

Ext.data.reader.Xml

这三种Reader。

使用Reader很简单，只需要在代理的配置对象内，定义reader配置项就可以了，它的值也是一个配置对象。

注意返回的数据有一定的格式要求。

{
    success: true,
    msg: "处理错误",
    data:[
        {
            ProductId:1,
            ProductName:"主板",
            Price:700.00,
            Stock:10,
            comments:[
                {CommentId: 1 ,Title: "评论1" ,Posttime: "2013-03-21 13:10:10" , Content: "评论内容" ,User: "用户1" ,ProductId: 1},
                {CommentId: 2 ,Title: "评论2" ,Posttime: "2013-03-24 08:30:20" , Content: "评论内容" ,User: "用户2" ,ProductId: 1}
            ]
        }
    ]
}

这里successs的作用说明返回数据是否成功，如果返回false，表示不成功，会触发exception事件。

属性total将返回记录的总数，在模型调用中往往忽略该参数。

属性data将以数据的形式返回数据。

msg则是返回提示信息，如果在服务器端发生错误时，就可设置success为false，并通过msg属性返回错误信息，以便在exception中处理。

reader: {
    type: 'json',         // type说明了Reader的类型, 这里使用的是JSON的reader
    rootProperty : "data",         // 说明了数据在data属性内, 可以从data属性内获取数据
    messageProperty: "msg"   // 说明返回信息在msg属性内
},

总数默认就是从total中获取，所以不需要定义，如果不想使用默认的total，可以使用totalProperty配置项来定义。

Ajax异常处理

即使访问正常，但是success中为false，也会出发exception事件，这个异常的处理要和Ajax的异常处理区分开来。

Ext.data.writer.Writer

Writer也是一个api

如果新建了一个模型或者实例可以用sava方法来保存，想删除可以用erase或者destroy方法。

erase，save和load差不多。

这里讲的是如何按规定格式提交数据。

扩展代理以实现格式化，标准化，统一化

从Ext.data.proxy.Ajax扩展出固定Reader、Writer和监听Exception事件的自定义代理类，

写代理的时候只需要修改type中的定义和添加api就行了。

模型的load方法

load是一个静态的方法，通过模型实例的id来异步加载数据

load( id, [config], [scope] )STATIC

MyApp.User = Ext.define('User', {
    extend: 'Ext.data.Model',
    fields: [
        {name: 'id', type: 'int'},
        {name: 'name', type: 'string'}
    ]
});

MyApp.User.load(10, {
    scope: this,
    failure: function(record, operation) {
        //do something if the load failed
    },
    success: function(record, operation) {
        //do something if the load succeeded
    },
    callback: function(record, operation) {
        //do something whether the load succeeded or failed
    }
});