Are refs overriden or inherited in extjs?

Question

I had this parent class: suppose its correct syntax (view aliases, repositories and xtypes types):

Ext.define('myParent' { extend : 'Ext.app.Controller', refs : [{ ref : 'formwindow', selector : 'forms-formwindow' }, { ref : 'mainForm', selector : '#mainForm' }], }); i had this subclass : Ext.define('myChild' { extend : 'myParent', }); 

whenever I put this code in my subclass:

 refs : [{ ref : 'myReference', selector : 'myProduct' }], 

I got this error at runtime:

 Uncaught TypeError: Object [object Object] has no method 'getMainForm' 

I am wondering if the refs from the parent class were overridden by my child class ....

what happened? does this really override myParent links?

Answer 1

As you yourself found out, there is no special call to the refs property, so yes, it becomes overridden.

To increase it instead of replacing, you will need to do this in the constructor of the child classes, as in this example:

 Ext.define('myChild', { extend: 'myParent' ,constructor: function() { this.refs = (this.refs || []).concat([{ ref: 'myReference', selector: 'myProduct' }]); this.callParent(arguments); } }); 

Answer 2

It really causes me problems with Ext Controllers, so today I have a fix, the rixo solution works fine, but there is an alternative to extending each child class. Ext.app.Controller extension instead using the onClassExtended method

  /** * Extends Ext.app.Controller with the ability to have refs defined in * Controllers and any of subclasses. * Duplicate refs overwrite each other, last one in class hierarchy wins. */ Ext.define('App.Controller', { extend: 'Ext.app.Controller', //private make refs extensible by any subclasses onClassExtended : function(cls, data, hooks) { var onBeforeClassCreated = hooks.onBeforeCreated; hooks.onBeforeCreated = function(cls, data) { var me = this, name = Ext.getClassName(cls), prototype = cls.prototype, superCls = cls.prototype.superclass, thisRefs = data.refs || [], superRefs = superCls.refs || [], newRefs = [], i = 0; if (thisRefs.length > 0) { for (i=0; i < thisRefs.length; i++) { if (typeof thisRefs[i] !== 'undefined') { newRefs.push(thisRefs[i]); } } } if (superRefs.length > 0) { for (i=0; i < superRefs.length; i++) { if (typeof superRefs[i] !== 'undefined') { newRefs.push(superRefs[i]); } } } data.refs = newRefs; onBeforeClassCreated.call(me, cls, data, hooks); }; } });