在extjs上调用父类函数3

时间:2011-11-06 06:29:51

标签: class function parent extjs3

我有这样的extjs类用于添加:

    Ext.ns('Example');

Example.Form = Ext.extend(Ext.form.FormPanel, {

   ,initComponent:function() {
        // hard coded - cannot be changed from outsid
        var config = {
            items: [{
            xtype: 'textfield',
            fieldLabel: 'title',
            name: 'author',
            allowBlank: false
          }

         .........................

    ]
            ,buttons:[
                {
                    text:'submit'
                    ,formBind:true
                    ,scope:this
                    ,handler:this.submit
            }]
        }; // eo config object

        // apply config
        Ext.apply(this, Ext.apply(this.initialConfig, config));

        // call parent
        Example.Form.superclass.initComponent.apply(this, arguments);
    } // eo function initComponent
    /**
    * Form onRender override
    */
    ,onRender:function() {
        ..................
    } // eo function onRender
    /**
    * Reset
    */
   ,reset:function() {
        this.getForm().reset();
    } // eo function onRender
    /**
    * Load button click handler
    */
    ,onLoadClick:function() {
       ....................
    } 

    ,submit:function() {
        ........................
    } 

    ,onSuccess:function(form, action) {
       ..........................
    } 


    ,onFailure:function(form, action) {
           ......................          
    } // eo function onFailure

    ,showError:function(msg, title) {
         ........................
        });
    } 
}); 

我还有另一个编辑扩展名:

Example.Form2 = Ext.extend(Example.Form, {

    ......
 });

我如何从secound类中的第一个类调用“onLoadClick”函数?因为我想在表单加载之前将数据加载到我的表单。

2 个答案:

答案 0 :(得分:7)

如果你有一个扩展另一个类的类,你可以使用类定义中的超类属性来调用“父”类方法。

在下面的例子中,我们添加了一个特殊的函数mySpecial add,并使其调用父类的add函数。

Ext.ux.myForm = Ext.extend(Ext.form.FormPanel, {
   ...
   mySpecialAdd: function(comp, anExtraParam) {
     // some special handling here
     ...
     // call parent class add
     return Ext.ux.myForm.superclass.add.call(this, comp);
   }
})

代替通话,您也可以选择使用应用

Ext.ux.myForm = Ext.extend(Ext.form.FormPanel, {
   ...
   mySpecialAdd: function(comp, anExtraParam) {
     // some special handling here
     ...
     // call parent class add
     return Ext.ux.myForm.superclass.add.apply(this, [comp]);
   }
})

请注意,“this”仍然是您的新类,因此您覆盖的任何其他函数都将是从父类调用的函数,而不是父类函数。

实施例 Ext.form.FormPanel有一个在Ext.form.FormPanel.add中调用的onAdd方法,所以如果你覆盖onAdd那么它就是你调用的函数。

Ext.ux.myForm = Ext.extend(Ext.form.FormPanel, {
   ...
   mySpecialAdd: function(comp, anExtraParam) {
     // some special handling here
     ...
     // call parent class add
     return Ext.ux.myForm.superclass.add.apply(this, [comp]);
   },
   // even though onAdd is marked as private you are actually still overwriting it here
   // because of the way its implemented in Ext 3
   onAdd: function(c) {
      // this will get called from the parent class (Ext.form.FormPanel) add method.
      ...

      // so make sure you handle it nicely
      Ext.ux.myForm.superclass.onAdd.call(this, c);

      ...
   }
})

答案 1 :(得分:2)

如果需要将超类方法调用到子类的方法中,可以执行以下操作:

Example.Form2 = Ext.extend(Example.Form, {

    testMethod: function(){
       ...
       //call parent class method
       Example.Form2.superclass.doLoadClick.call(this);
       ...
    }
 });

这是你的意思吗?