ExtJS 物件導向

1.extends

Ext.onReady(function () {

    Ext.define('Family.Father', {
        //若太多屬性可使用config
        config:{
            Name: '',
            Money: 0
        },
        //alias: ['widget.Father'],//xtype:Father
        alias:'Father',
        MyMoney:function(){
            Ext.Msg.alert("Father's money : " + this.Money);
            console.log("Father's money : " + this.Money);
        },
        constructor: function (config) {
            //config初始化
            this.initConfig(config);
        }
    });

    Ext.define('Family.Son', {
        extend: 'Family.Father',
        alias: 'Son',
        SonMoney:function(){
            Ext.Msg.alert("Son's money : " + this.Money);
            console.log("Son's money : " + this.Money);
        },
        //若子類別有建構子，不會再調用父類別建構子
        //若只是單純調用父類別的建構子，可省略下方
        constructor: function () {
            //此方式可以使用子類別建構子外，並調用父類別建構子
            this.callParent(arguments);
        }
    });

    //alias: 'Son'
    var son = Ext.create('Son', {
        Name: 'summer',
        Money: 2000000
    });
    son.SonMoney();
    son.MyMoney();
});

2.apply/applyIf

Ext.apply(config1, config2);

3.override

//覆寫Ext.form.Field裡面的reset
//This method has been DEPRECATED since 4.1.0
//Use Ext.define instead

Ext.form.Field.override({
        reset: function () {
            var me = this;
            me.beforeReset();
            me.setValue('');//me.setValue(me.originalValue);
            me.clearInvalid();
            // delete here so we reset back to the original state
            delete me.wasValid;
        }
    });

    //新增clear method於Ext.form.Basic(用法 xxForm.getForm().clear();)
    Ext.define('TRA.form.Form', {
        override: 'Ext.form.Basic',
        clear: function () {
            Ext.suspendLayouts();
            var me = this,
                fields = me.getFields().items,
                f,
                fLen = fields.length;
            for (f = 0; f < fLen; f++) {
                fields[f].setValue('');//fields[f].reset();
                fields[f].clearInvalid();
            }
            Ext.resumeLayouts(true);

            //if (resetRecord === true) {
                delete me._record;
            //}
            return me;
        }
    });

    //grid預設鎖住排序與篩選
    Ext.define('TRA.form.Form', {
        override: 'Ext.grid.column.Column',
        sortable: false,
        menuDisabled: true
    });