ext组件继承

extjs项目中碰到一个问题，可以自定义一个按钮来实现，并在按钮中加入自己想要的业务逻辑，和java的继承类似，例子参考如下：

 

/***********扩展button*****start*/
Ext.Button.MyButton = Ext.extend(Ext.Button, {
    hidden : false,
    disabled : false,
    onRender : function(ct, position){
        if(!this.template){
            if(!Ext.Button.buttonTemplate){
                
                Ext.Button.buttonTemplate = new Ext.Template(
                    '<table id="{4}" cellspacing="0" class="x-btn {3}"><tbody class="{1}">',
                    '<tr><td class="x-btn-tl"><i> </i></td><td class="x-btn-tc"></td><td class="x-btn-tr"><i> </i></td></tr>',
                    '<tr><td class="x-btn-ml"><i> </i></td><td class="x-btn-mc"><em class="{2}" unselectable="on"><button type="{0}"></button></em></td><td class="x-btn-mr"><i> </i></td></tr>',
                    '<tr><td class="x-btn-bl"><i> </i></td><td class="x-btn-bc"></td><td class="x-btn-br"><i> </i></td></tr>',
                    '</tbody></table>');
                Ext.Button.buttonTemplate.compile();
            }
            this.template = Ext.Button.buttonTemplate;
        }
        var btn, targs = this.getTemplateArgs();

        if(position){
            btn = this.template.insertBefore(position, targs, true);
        }else{
            btn = this.template.append(ct, targs, true);
        }
        
        this.btnEl = btn.child(this.buttonSelector);
        this.mon(this.btnEl, {
            scope: this,
            focus: this.onFocus,
            blur: this.onBlur
        });

        this.initButtonEl(btn, this.btnEl);
        Ext.ButtonToggleMgr.register(this);
        this.getAuditFlag();
    },
    getAuditFlag : function(){//加入业务逻辑函数，new该按钮时会执行才函数
    	var flag = 0;
    	Ext.Ajax.request({
    		url : TEST.CTX+'/test/testController/getPersonInfoByPersonCode.do',
			async : false,  
			method : 'POST',
			success : function(resp, opts) {
				var respText = Ext.util.JSON.decode(resp.responseText);
				flag = respText;
			},
			failure : function() {
				Ext.MessageBox.show("出错！","获取数据失败！");
			}
    	});
    	
		if(flag!='1'){//当前人员没有审核权限时，设置按钮为hide	
			this.hide(true);
//			this.disabled = true;
		}
    	}
	});
			
	Ext.reg('myButton', Ext.Button.MyButton);  //注册自定义按钮
/***********扩展button*****end*/

使用示例：

var btn = new Ext.Button.MyButton({
		id : 'myButtonId',
		text: '审核'
	});