|
在发布的ExtJS4版本中，在data包中新增加了一个类Model（模型类）。这个类有点类似于ExtJS3.x中的record，但是新添加的Model的功能要比record类的功能强大的多，下面我们就是一起讨论一下。Model类的功能:
(一)、首先我们介绍一下Model类中比较常用的几个属性,如果我们想构建一个Model类，最主要的属性就是(Fields)属性，这个属性接受一个数组。用来设置Model中所包含的字段。定义的格式如下:
Ext.regModel('Student',{
{name:'name',type:'string'},
{name:'class',type:'string'}
});
(二)、在我们了解到怎么定义一个简单的Model，以及定义Model所需要的属性时。下面我们来看一下。Model类为我们提供了哪些比较好的功能。
Ext.regModel('Student',{
{name:'name',type:'string'},
{name:'class',type:'string',convert:function(val){
if(val=='1'){return'一班'};
if(val=='2'){return'二班'};
if(val=='3'){return'三班'}；
}}
});
通过上边的设置，我们就对数据做了相应的转换了，呈现到客户面前的不再是（1、2、3）,这样我们的呈现就变得比较友好了。
var student=new Student({
name:'Jerry',
class:'2'
});
上述代码我们根据Student的模型类，定义了一个该类的对象，但是，往往在我们的应用程序中，像这样的情况很少，毕竟我们的数据不一定都是这种一成不变的数据，有时候我们需要从后台加载我们的数据，然后给于我们的model类。这就需要我们的模型类有能够请求后台的能力，这也是Model中提供的第二个功能，Model中提供一个属性proxy（代理）。这个proxy中有几个比较重要的属性（type、url、reader），type属性值是一个字符串形式，用来表明。该代理的一种类型，具体的我们可以查看API中了解有哪些类型，url也就是请求后台的url、reader，也就是我们要用什么样的阅读器，来解析我们的数据，具体的，我们可以看一下。下边简单的例子：
Ext.regModel('Student',{
{name:'name',type:'string'},
{name:'class',type:'string',convert:function(val){
if(val=='1'){return '一班'};
if(val=='2'){return '二班'};
if(val=='3'){return '三班'}；
}}
type:'rest',
url:'data/1.aspx',
reader:'json'
});
Student.load(001,{
success:function(student){
//处理加载完成的逻辑
}
});
1.aspx返回的数据格式：
{id:001,name:'zhangsan',class:'2'}
经过上述的设置，我们的Model就可以与后台交互，并要求后台返回我们想要的数据了，这个也是之前record类所办不到的。
{
id:'009',
name:'Jerry',
subjects:[
{id:'001',name:'English'},
{id:'002',name:'Mathematics'}
]
}
在上述的数据中，科目和学生之间是有一定的联系的。所以，我们也在想，解析数据的时候，让他们保持这种联系，以便于我们更好的解析数据。这样我们就用到了Model中的belongsTo和hasMany这样两个属性。首先要解析这样的数据，我们需要定义好我们的Model类。如下:
Ext.regModel('subject',{
fields:[
{name:'id',type:'string'},
{name:'name',type:'string'}
],
belongsTo:'Stdudent'
});
Ext.regModel('Student',{
fields:[
{name:'id',type:'string'},
{name:'name',type:'string'}
],
proxy:{
type:'rest',
url:'data/1.aspx',
reader:'json'
},
hasMany:[{model:'subject',name:'subjects'}]
});
注意“hasMany”和“belongsTo”的使用。
在我们定义好Model后，下面我们就可以加载并解析我们的数据了。
Student.load('009',{
success:function(student){
alert(student.get('id'));
alert(student.subjects().getCount());//我们可以直接访问该学生的科目
}
})
});
Ext.regModel('Student',{
fields:[
{name:'id',type:'string'},
{name:'name',type:'string'}
],
proxy:{
type:'rest',
url:'data/1.aspx',
reader:'json'
},
hasMany:[{model:'subject',name:'subjects'}]，
validations:[
{type:'presence',field:'id'},
{type:'length',field:'name',min:3}
]
});
var student=new Student({id:'001',name:'z'});
var stuvalidate=student.validate();//得到验证类
stuvalidate.isValid();//返回验证结果true或false
stuvalidate.each(function(error){
alert(error.field ' ' error.message);//遍历验证的信息
});
以上就是Model中的四大特性，有什么欠缺之处，还希望大家指正。大家一起交流。
|
|
|
