ExtJS4.x数据模型之Model
1. 基本概述
ExtJS不仅有令人眩目的UI组件还有非常完善的数据模型，它将整个数据读取过程分解为几个相互配合的独立部分，可以根据数据结构的不同和获取方式的不同，对这些部分进行灵活的组合，最终达到灵活使用数据的目的。
其中，Ext.data.Model数据实体模型是真实世界中实体对象在应用系统中的反映，它包含字段集和处理数据的函数，它的前身是ExtJS 3.x以及以前版本中的Ext.data.Record类，如图：
2. 创建、实例化Model
ExtJS4.x数据模型中的Model其实可以简单的理解为DB中的Table、Java中的Class等，我们通过一个简单的例子来了解下。
1. (function() {
2. Ext.onReady(function() {
3. Ext.define('person', {
4. extend: 'Ext.data.Model',
5. fields: [{
6. name: 'name',
7. type: 'auto'
8. }, {
9. name: 'age',
10. type: 'int'
11. }, {
12. name: 'email',
13. type: 'auto'
14. }]
15. });
16.
17. Ext.regModel('user', {
18. fields: [{
19. name: 'name',
20. type: 'auto'
21. }, {
22. name: 'age',
23. type: 'int'
24. }, {
25. name: 'email',
26. type: 'auto'
27. }]
28. });
29.
30. var p = new person({
31. name: 'Elvin.Cracker',
32. age.com'
34. });: 24,
33. email: 'elvin.cracker@gmail
35. // alert(p.get('name'));
36.
37. var p1 = Ext.create('person', {
38. name: 'Elvin.Cracker',
39. age: 24,
40. email: '[email protected]'
41. });
42. // alert(p1.get('age'));
43.
44. // var p = Ext.ModelManager.create({
45. var p2 = Ext.ModelMgr.create({
46. name: 'Elvin.Cracker',
47. age: 24,
48. email: '[email protected]'
49. }, 'person');
50. // alert(p2.get('email'));
51.
52. alert(person.getName());
53. });
54. })();
在上面的例子中，我们介绍了两种方式创建Model类，一种是使用Ext.define的方式，另外一种是Ext.regModel的方式。在MVC的设计过程当中第一种显然不是最合适的，因为每次都要写继承Ext.data.Model，其中Ext.regModel的返回值其实就是Ext.data.Model对象。www.2cto.com
除此之外，我们也介绍了三种方式创建Ext.data.Model的实例对象，第一种方式通过new关键字创建，第二种方式使用Ext.create方式创建，第三种使用Model的统一管理类Ext.ModelManager来创建，这个使用的是Ext.ModelManager的别名Ext.ModelMgr，效果是一样的。
3. 数据验证
数据验证（Validation）也是非常重要、而且使用频繁的一个知识点，我们还是先通过一个简单的例子了解下。
1. (function() {
2. Ext.data.validations.lengthMessage = '错误的长度';
3. Ext.onReady(function() {
4. Ext.apply(Ext.data.validations, {
5. age: function(config, value) {
6. if (value === undefined || value === null) {
7. return false;
8. }
9.
10. var min = config.min;
11. var max = config.max;
12. if (min <= value && value <= max) {
13. return true;
14. } else {
15. this.ageMessage = this.ageMessage + ', 他(她)的范围应该在[' + min + '~' + max + ']';
16. return false;
17. }
18. },
19. ageMessage: '错误的年龄大小'
20. });
21.
22. Ext.define('person', {
23. extend: 'Ext.data.Model',
24. fields: [{
25. name: 'name',
26. type: 'auto'
27. }, {
28. name: 'age',
29. type: 'int'
30. }, {
31. name: 'email',
32. type: 'auto'
33. }],
34. validations: [
35. {type: 'length', field: 'name', min: 2, max: 6},
36. {type: 'age', field: 'age', min: 0, max: 150}
37. ]
38. });
39.
40. var p = Ext.create('person', {
41. name: 'Elvin.Cracker',
42. age: -24,
43. email: '[email protected]'
44. });
45.
46. var errors = p.validate();
47. var message = [];
48. errors.each(function(v) {
49. message.push(v.field + ' ' + v.message);
50. });
51. alert(message.join('\n'));
52. });
53. })();
在上面的例子中，我们使用了两种数据验证的方式，第一种为ExtJS自带的验证方式，另外一种为我们自定义的方式。ExtJS数据验证是通过validations实现的，其中验证长度官方提供了使用方法：
1. validations: [{type: 'length', field: 'name', min: 2}]
但是在大多数情况下，官方提供的数据验证的方式并不能满足我们的日常应用，我们就需要自定义数据验证。我们可选的方式大概有两种，第一种我们可以自定义一个类，然后继承validations，再扩展其功能，第二种我们通过改造原生类的方式进行实现。
1. apply( Object object, Object config, [Object defaults] ) : Object
● 第一个参数是指所要扩展的原生类
● 第二个参数是指要扩展的属性
● 第三个参数是指传递的默认参数
其中，我们要区分Ext.apply和Ext.applyIf，Ext.apply所以定的属性即使和原生类有相同的，也不会覆盖，而Ext.applyIf则会覆盖原生类属性。扩展属性的方法如何写呢？我们之需要看下原生类提供的基本方法的源代码，依样画葫芦即可。
转自：http://www.2cto.com/kf/201206/136071.html