ExtJS4: Cómo pasar argumentos a initComponent

Question

Estoy usando Sencha Architect 2. Estoy intentando generar un elemento UI genérico con una búsqueda de texto y una tabla que muestre los resultados. Genérico significa que quiero usarlo para varios tipos diferentes de búsquedas, p. para usuarios, o roles o aún algo más.

Así que lo que definitivamente me gusta en este contexto sobre Sencha Architect 2 es que siempre genera clases. Aquí está mi clase generada:

Ext.define('ktecapp.view.ObjSearchPanel', { 
    extend: 'Ext.container.Container', 
    alias: 'widget.objsearchpanel', 

    height: 250, 
    id: 'UserSearchPanel', 
    itemId: 'UserSearchPanel', 
    width: 438, 
    layout: { 
     columns: 3, 
     type: 'table' 
    }, 

    initComponent: function() { 
     var me = this; 

     Ext.applyIf(me, { 
      items: [ 
       { 
        xtype: 'textfield', 
        itemId: 'txtSearchText', 
        fieldLabel: 'Search Text', 
        colspan: 2 
       }, 
       { 
        xtype: 'button', 
        id: 'searchObj', 
        itemId: 'searchObj', 
        text: 'Search', 
        colspan: 1 
       }, 
       { 
        xtype: 'gridpanel', 
        height: 209, 
        itemId: 'resultGrid', 
        width: 430, 
        store: 'UserDisplayStore', 
        colspan: 3, 
        columns: [ 
         { 
          xtype: 'gridcolumn', 
          width: 60, 
          dataIndex: 'ID', 
          text: 'ID' 
         }, 
         { 
          xtype: 'gridcolumn', 
          width: 186, 
          dataIndex: 'DISPLAYNAME', 
          text: 'Displayname' 
         }, 
         { 
          xtype: 'gridcolumn', 
          width: 123, 
          dataIndex: 'JOBTITLE', 
          text: 'Job Title' 
         }, 
         { 
          xtype: 'actioncolumn', 
          width: 35, 
          icon: 'icons/zoom.png', 
          items: [ 
           { 
            icon: 'icons/zoom.png', 
            tooltip: 'Tooltip' 
           } 
          ] 
         } 
        ], 
        viewConfig: { 

        }, 
        selModel: Ext.create('Ext.selection.CheckboxModel', { 

        }) 
       } 
      ] 
     }); 
     me.callParent(arguments); 
    } 
}); 

El problema que estoy teniendo es que todo tiene que ser bastante personalizable, dataIndexes de las columnas, la tienda, ... Entonces, ¿cómo puedo obtener un constructor como función de la clase ObjSearchPanel donde paso toda esa información? En el código por encima de todo esto se ve más o menos hardcoded ...

Gracias de antemano Kai

Answer 1

realidad (en ExtJS 4), cuando pasar un objeto de configuración al constructor, este objeto de configuración se asigna a la variable this.initialConfig y todavía está disponible para otras funciones de la clase. Para que pueda usarlo en el initComponent.

Todavía puede encontrar el código en ExtJS 3.3 como este Ext.apply(this, Ext.apply(this.initialConfig, config)); en el initComponent de las clases. Sin embargo, utilícelo bajo su propio riesgo, ya que no está en el documento de ExtJS 4, solo lo encontró en el código fuente.

Answer 2

uso config,

http://docs.sencha.com/ext-js/4-0/#!/api/Ext.Class-cfg-config

Ext.define('SmartPhone', { 
    config: { 
     hasTouchScreen: false, 
     operatingSystem: 'Other', 
     price: 500 
    }, 
    constructor: function(cfg) { 
     this.initConfig(cfg); 
    } 
}); 

var iPhone = new SmartPhone({ 
    hasTouchScreen: true, 
    operatingSystem: 'iOS' 
}); 

iPhone.getPrice(); // 500; 
iPhone.getOperatingSystem(); // 'iOS' 
iPhone.getHasTouchScreen(); // true; 
iPhone.hasTouchScreen(); // true