更多的ExtJS教程,点击进入>>《ExtJS 教程目录》,持续更新中……
转载自起飞网,原文地址:http://www.qeefee.com/extjs-course-4-data-model
- ExtJS 4.2 教程-01:Hello ExtJS
- ExtJS 4.2 教程-02:bootstrap.js 工作方式
- ExtJS 4.2 教程-03:使用Ext.define自定义类
- ExtJS 4.2 教程-04:数据模型
- ExtJS 4.2 教程-05:客户端代理(proxy)
- ExtJS 4.2 教程-06:服务器代理(proxy)
- ExtJS 4.2 教程-07:Ext.Direct
我们在上一节中介绍了如何在ExtJS 中自定义类,这一节中将介绍如何自定义数据模型。
自定义数据模型
在上一节中,我们使用Ext.define 来自定义类,通过Ext.define 定义的类都默认继承自Ext.base 类。如果我们将extend 设置为Ext.data.Model,那么定义的类就是一个数据模型类了。先定义一个简单的数据模型类 User类,代码如下:
Ext.define('MyApp.User', { extend: 'Ext.data.Model', fields: [ { name: 'name', type: 'string' }, { name: 'age', type: 'int' }, { name: 'phone', type: 'string' } ] });
在代码中可以看出,数据模型类其实就是一个继承自Ext.data.Model 的类。
fields 属性中定义了该模型的字段,它可以是对应到数据库中的字段。在使用的时候,数据模型包含的字段和类的属性使用方式不太相同。要访问字段的值,需要视同get 和 set 方法,例如:
var Tom = Ext.create("MyApp.User", { name: 'Tom', age: 26, phone:'123456' }); Tom.set('age', 20); Ext.MessageBox.alert('提示', Tom.get('age'));
我们实例化User类,初始化的时候,age的值为26,然后通过set 方法设置为 20,再通过get 方法得到 age 字段的值,运行截图如下:
字段类型和转换器
在定义数据模型的时候,我们可以定义字段的类型和该类型的转换器。例如,我们将为User类添加birthday字段,在初始化的时候,我们可能会传入一个字符串类型的日期格式,这个时侯就需要我们来定义一个类型转换器,将字符串格式的日期转换为Date类型。代码如下:
Ext.define('MyApp.User', { extend: 'Ext.data.Model', fields: [ { name: 'name', type: 'string' }, { name: 'age', type: 'int' }, { name: 'phone', type: 'string'