结构
代码行数不要超过 15 行,为啥是 15 呢?我也不知道。
1 /** 2 * 根据元数据自动生成的表单。 3 */ 4 Ext.define('Happy.form.metadata.Panel', { 5 extend: 'Happy.form.Panel', 6 alias: 'widget.happy-metadata-form', 7 mixins: { 8 'custom-configable': 'Happy.mixin.CustomConfigable' 9 }, 10 11 /** 12 * 根据元数据配置表单 items。 13 * 14 * @protected 15 */ 16 configItems: function () { 17 var me = this; 18 19 me.items = Ext.clone(me.metadata.getDefaultFormItems()); 20 21 me.customConfigArray(me.items, 'name', 'config-item-'); 22 23 me.callScene('configItems', arguments); 24 }, 25 26 /** 27 * 根据元数据配置按钮。 28 * 29 * @protected 30 */ 31 configButtons: function () { 32 var me = this; 33 34 var actions = [ 35 { 36 type: 'save', 37 remoteSave: me.metadata.isLifeCycleIndependent() 38 }, 39 { 40 type: 'close' 41 } 42 ]; 43 44 me.customConfigArray(actions, 'type', 'config-button-'); 45 46 me.buttons = Happy.createActions(actions); 47 48 me.callScene('configButtons', arguments); 49 }, 50 51 /** 52 * 根据元数据配置和当前表单相关的 items,如:订单的订单项列表。 53 * 54 * @protected 55 */ 56 configRelatedItems: function () { 57 var me = this; 58 59 var relatedItems = me.callScene('getRelatedItems', arguments); 60 if (!relatedItems) { 61 return; 62 } 63 if (relatedItems.length == 0) { 64 return; 65 } 66 67 me.addDocked({ 68 xtype: 'tabpanel', 69 height: 200, 70 dock: 'bottom', 71 items: relatedItems 72 }, 1); 73 74 me.on('recordloaded', function (form, record) { 75 Ext.Array.each(relatedItems, function (item) { 76 var grid = me.down(item.xtype); 77 grid.reconfigure(record[item.plural]); 78 grid.reselect(); 79 if (!record[item.plural].isNested) { 80 record[item.plural].reload(); 81 } 82 }); 83 }); 84 } 85 });
备注:我目前写的方法,几乎都自然的控制在 15 行以内。
优点
- 函数更容易起名字了,代码行数的减少意味着职责的更单一,因此名字更容易命名。
- 函数更容易阅读了。
- 函数更容易书写了。