我们在上一节中介绍了如何在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' },
{
name: 'birthday',
type: 'date',
convert: function
(value, record) { if (Ext.isDate(value)) return value; else if (Ext.isString(value)) { return Ext.Date.parse(value, "Y-m-d"
);
}
}
}
]
});
在代码中添加了birthday字段，并为该字段设置了转换器，当传入的类型为string时，将会被转换为标准的时间类型。用法如下：
var Tom = Ext.create("MyApp.User", {
name: 'Tom',
age: 26,
phone: '123456',
birthday:'2000-01-15'
});
alert(Tom.get('birthday'));
在使用的时候，传入的是一个字符串类型的时间，当我们实例化以后，字符串日期被转换为标准的时间类型：
数据验证
我们可以使用数据模型来验证数据是否正确。在上面的例子中，我们希望phone 字段的长度在8和15之间，那么，我们需要这样修改代码：
Ext.define('MyApp.User', {
extend: 'Ext.data.Model',
fields: [
{ name: 'name', type: 'string' },
{ name: 'age', type: 'int' },
{ name: 'phone', type: 'string' },
{
name: 'birthday',
type: 'date',
convert: function (value, record) {
if (Ext.isDate(value))
return value;
else if (Ext.isString(value)) {
return Ext.Date.parse(value, "Y-m-d");
}
}
}
],
validations: [
{ field:
'phone', type: 'length'
, min: 8, max: 15 }
]
});
为phone 字段添加验证，验证类型为length，最小为8，最大为15，验证的代码如下：
var Tom = Ext.create("MyApp.User", {
name: 'Tom',
age: 26,
phone: '123456',
birthday:'2000-01-15'
});
var errors = Tom.validate();
var errorMsg = [];
if (!errors.isValid()) {
errors.each(function (error) {
errorMsg.push(error.field + " " + error.message);
});
Ext.Msg.alert("错误", errorMsg.join('<br />'));
}
我们将phone的长度设置为6位，很明显是不能通过验证的。程序运行起来以后，我们会得到下面的错误：
尽管我们已经引入了汉化包，但这里的提示还是英文的，为了能让他显示为中文，我们需要手动的来将其汉化，在程序开始的时候加入代码：
Ext.data.validations.lengthMessage = "长度错误";
刷新我们的页面，错误提示已经变成中文了：
由此可以看出，ExtJS 的验证错误提示是没有进行汉化的，我们可以将相应的汉化代码写在Layout中，方便所有页面都能够使用。
自定义验证规则
ExtJS 中虽然内置了一些验证规则，但这些规则面对庞大的业务需求肯定是不够的，所以ExtJS 还允许我们自定义验证规则。
在User类中，我们希望age字段的值在0到150之间，我们来自定义一个验证规则：
Ext.apply(Ext.data.validations, {
ageMessage: '必须在0到150之间',
age: function (config, value) {
if (value === undefined || value === null) {
return false;
}
if (value < 0 || value > 150) {
return false;
}
return true;
}
});
Ext.apply 方法用来将第二个参数中的属性和方法复制到第一个参数中，在这里的作用是将我们定义的age规则添加到Ext 的验证规则中。
接下来我们修改验证部分的代码，添加age验证：
validations: [
{ field: 'phone', type: 'length', min: 8, max: 15 },
{ field: 'age', type: 'age', min: 8, max: 15 }
]
在初始化的时候，我们将age的值设置为-26，运行程序，截图如下：
数据模型之间的关系
（本段内容翻译自官方api）
模型之间可以通过 Ext.data.association.HasOne, belongsTo 和 hasMany 设置彼此的关系。例如在博客管理程序中，我们需要处理用户（Users）、文章（Posts）和评论（Comments）之间的关系，他们的关系如下：
Ext.define('Post', {
extend: 'Ext.data.Model',
fields: ['id', 'user_id'],
belongsTo: 'User',
hasMany: { model: 'Comment', name: 'comments' }
});
Ext.define('Comment', {
extend: 'Ext.data.Model',
fields: ['id', 'user_id', 'post_id'],
belongsTo: 'Post'
});
Ext.define('User', {
extend: 'Ext.data.Model',
fields: ['id'],
hasMany: [
'Post',
{ model: 'Comment', name: 'comments' }
]
});
你可以通过查看API来了解更多的用法，另外，他们之间的关系还可以这样定义：
Ext.define('User', {
extend: 'Ext.data.Model',
fields: ['id'],
associations: [
{ type: 'hasMany', model: 'Post', name: 'posts' },
{ type: 'hasMany', model: 'Comment', name: 'comments' }
]
});