2011-02-08 23 views
5

Tengo una pregunta sobre la herencia múltiple en ExtJS. Aunque sé que puedo simplemente duplicar el código para que suceda, pero quiero saber si hay alguna forma de codificarlo de manera más eficiente.herencia múltiple Extjs?

Tengo un componente personalizado GridPanel en mi marco, llamado Kore.ux.grid.GridPanel. Extiende Ext.GridPanel con funcionalidades extra comunes y proporciona una interfaz para acciones de REST.

Poco tiempo después, mi colega quería que también se implementara EditorGridPanel de la misma manera, es decir, quiere que se pueda editar y, al mismo tiempo, tener la capacidad de realizar acciones de REST fácilmente.

Mi pregunta es, ¿hay alguna manera de que pueda extender Ext.EditorGridPanel para tomar las funcionalidades personalizadas Kore.ux.grid.GridPanel?

Disculpa las errores de gramática y puedo volver a formularlas en caso de confusión. ¡¡Gracias!!

EDITAR

Busqué en Google de nuevo, y encontraron hilos diciendo que es imposible. ¿Hay algún patrón de codificación mejor que debería seguir si tengo este problema?

Gracias!

nuevo EDIT

Lo siento me encontré con la estructura que se adapte a mí .. Este es el método que encontré útil para mí:

var Common = function(){} //abstract class 
Ext.apply(Common.prototype, { 

    a : function(){}, 
    b: function(){}... 

}); 

Ext.ux.SomePanelA = Ext.extend (Ext.Panel, { 

    stuff : ............ 

}); 

Ext.ux.SomePanelB = Ext.extend (Ext.Panel, { 

    diffStuff : ............ 

}); 

Ext.applyIf(Ext.ux.SomePanelA.prototype, Common.prototype); 
Ext.apply(Ext.ux.SomePanelB.prototype, Common.prototype); 

Código Fuente: http://www.sencha.com/forum/showthread.php?48000-multiple-inheritance&p=228271&viewfull=1#post228271

favor de nuevo brinda sugerencias útiles si crees que tienes una mejor solución :) ¡Gracias!

Respuesta

5

Lo que realmente necesita ver, son los complementos de ExtJS.

/** 
* Boilerplate code taken from 'ExtJS in Action' by Jay Garcia 
*/ 
YourNameSpace.RestGridPlugin = Ext.extend(Object, { 
    constructor : function(config) { 
    config = config || {}; 
    Ext.apply(this.config); 
    }, 

    init : function(parent) { //parent argument here, is whatever you apply your plugin to 
    parent.on('destroy', this.onDestroy, this); 
    Ext.apply(parent, this.parentOverrides); 
    }, 

    onDestroy : function() { 
    //here you need to free any resources created by this plugin 
    }, 

    parentOverrides : { 
    //here you do your magic (add functionality to GridPanel) 
    } 

}); 

Ext.preg('restgridplugin',YourNameSpace.RestGridPlugin); //register your brand ne plugin 

Uso

someGrid = { 
    xtype: 'grid', 
    columns: ... 
    store: ... 
    plugins: [ 
    'restgridplugin' 
    ] 
} 

someEditorGrid = { 
    xtype: 'editorgrid', 
    columns: ... 
    store: ... 
    plugins: [ 
    'restgridplugin' 
    ] 
} 
+0

PLUGIN! ¿Por qué me olvido de su existencia? Gracias por la sugerencia :) Veremos cómo voy a incorporarlo en el marco.Gracias :) –

+0

Pero puede que esto no se adapte a mi caso ya que mi GridPanel personalizado proporciona paginación personalizada Barra de herramientas, botones predefinidos, cuadro de búsqueda, RESTO ... etc. El complemento podría no ser el camino :) ¡Gracias por la sugerencia de todos modos! –

+0

¿Por qué no? Puede acceder a estos componentes personalizados desde el complemento para vincular su funcionalidad a ellos. Después de todo, lo que hace el complemento es, de hecho, 'Ext.apply()' tal como lo hace ahora. Simplemente agrega una API un poco más robusta y fácil de usar para eso. – Mchl

0

Crea Kore.ux.grid.AbstractGridPanel como clase base con funcionalidad general. Y cree dos clases secundarias: Kore.ux.grid.GridPanel y Kore.ux.grid.EditorGridPanel (con funcionalidad específica).

+0

La cosa es, '' Ext.grid.EditorGridPanel' extiende Ext.grid.GridPanel', el resto La "interfaz" que proporcioné está extendiendo 'Ext.grid.GridPanel', y como necesito las funcionalidades proporcionadas en' Ext.grid.EditorGridPanel', creo que la mejor manera es escribir una clase base común y extender ambas 'Ext.grid .GridPanel' y 'Ext.grid.EditorGridPanel' con la clase base común. Gracias por la entrada de todos modos :) –

0

No estoy de acuerdo con el uso de plugins para lograr la herencia múltiple en Ext. Los complementos tienen la intención de cambiar el comportamiento o agregar nuevas funcionalidades.

El camino correcto para alcanzar la herencia múltiple es mediante el uso Mixins, por favor ver este increíble explicación SenchaCon 2011: The Sencha Class System

Ext.define('FunctionalityA', { 
    methodA: function() { 
     ... 
    } 
}); 

Ext.define('FunctionalityB', { 
    methodB: function() { 

    } 
}); 

Ext.define('MultipleFunctionality', { 
    mixins: [ 
     'FunctionalityA', 
     'FunctionalityB' 
    ], 

    method: function() { 
     methodA(); 
     methodB(); 
    } 
});