Ext JS 4 新特性2：配置项属性（config）之一-CSDN博客

Ext JS 4 新特征2：配置项属性config

最新版本的Ext JS 4.2的另外一个伟大的新特征就是增加了configuration配置项属性，当我们在创建一个新类的时候，经常性的要设置某某属性，依靠输入参数来改变我们某类的值属性和行为属性。Ext JS 4就在这方面使用了提前-处理机制来为我们处理配置，事实上很简单的就完成了这方面的任务。

举例：我手头上有一些发货单据，想统计一下，每张发货单上有以下内容：客户名称、税金、小计、合计，其中：合计 = 小计*税金，税率为0.083。

 1 //定义数据的发货单类，如下
 2 Ext.define('MyApp.data.Invoice',{
 3                 config    : {                            //第1步
 4                         client    : '',
 5                         tax        : 0.083,
 6                         subtotal: 0,
 7                         total    : 0
 8                 },            
 9                 //想通过税金来自动计算每张发货单的合计值，
10                 applySubtotal    : function(value){
11                             var  me = this;
12                             me.setTotal(value + value * me.getTax());
13                             return(value);                
14                 }        
15 });
16 //开始创建一张空白的发货单：
17 var invoice = Ext.create('MyApp.data.Invoice');
18     //显示空白的发货单据，目的是看这个对象是否真正的有了各项属性。
19         console.log("单位： "+invoice.getClient());
20         console.log("税率： "+invoice.getTax());
21         console.log("小计: "+invoice.getSubtotal());
22         console.log("合计："+invoice.getTotal());
23             
24     //开始填入第1张发货单据：
25         invoice.setClient("Tuxtux企业有限公司");    //填入客户名称
26         invoice.setSubtotal(1000);                 //填入单据金额小计，同时会自动产生合计数。
27         
28     //第1张发货单填完，显示其内容：            
29         console.log("单位： "+invoice.getClient());    
30         console.log("税率： "+invoice.getTax());            
31         console.log("小计: "+invoice.getSubtotal());
32         console.log("合计："+invoice.getTotal());

　　19-22行运行结果，如下： 29-32行运行结果，如下：

　　当我们使用config预-处理机时，Ext就会自动地创建了config项中对应的setters和getters函数，象client就会有了setClient(“ ”);和getClient();这样一对函数，来对client进行赋值和获值。这是需要记住的一点：买一送二概念，实际上应该是买一赠四的事实。

为了方便，需要自动计算发货单上的合计= 小计 * 税率，那我们怎样做呢？Ext提供了apply方法用于每个config配置项，这样就要增加一个自定义逻辑，需要对小计subtotal进行aplly覆盖，如下：

1 Ext.define('MyApp.data.Invoice',{
2                 。。。    
3                 //在这里需要设置自己的公式，自动生成合计数。
4                 applySubtotal    : function(value){                        //第1步
5                             var  me = this;
6                             me.setTotal(value + value * me.getTax());    //第2步，公式
7                             return(value);       //第3步，把1000返回到subtotal属性
8                 }        
9 });