Montag, Januar 27, 2020

Mit Hilfe von benutzerdefinierten Attributen in ExtJS-Komponente

Mein Antrag wurde immer mehr für das Letzte Jahr oder so und ich habe endlich angefangen zu splitten, in der die gemeinsamen Komponenten, die durch die Ausweitung der bestehenden. Ich habe festgestellt, dass dies wirklich hilfreich ist – die zunehmende Geschwindigkeit der Entwicklung und Wartung. Mein problem ist, dass ich noch nicht Begriffen, das Konzept der Verwendung von benutzerdefinierten Parametern, die auf meine Komponenten und war in der Hoffnung, es könnte jemand bieten einige Hilfe in dem folgenden Beispiel. Speziell ich bin anscheinend nicht in der Lage sein, um Zugriff auf die benutzerdefinierten parameter (myCustomParam) in die proxy-erklärt in der initComponent Funktion:

MyEmployeeGrid = Ext.extend(Ext.grid.GridPanel, {
 myCustomParam: "CompanyX",
 initComponent:function() {
    //Store Reader
    var myReader = new Ext.data.JsonReader({
        root : 'objectsToConvertToRecords',
        idProperty: 'id',
        fields : [
            {name: 'id'},
            {name: 'employee', allowBlank:false},
            {name: 'department', allowBlank:false}
        ]
    });

    //Store Proxy
    var dwrProxy = new Ext.ux.data.DwrProxy({
            apiActionToHandlerMap : {
            read : {
                dwrFunction : EmployeeService.readCompanyEmployees,
                getDwrArgsFunction: function(request, recordDataArray, oldRecordDataArray) {
                    return [myCustomParam];
                }
            }
        }
    });

    //Setup Params for the grid
    Ext.apply(this, {
        store: new Ext.data.Store({
             proxy: dwrProxy,
            reader: myReader,
            autoLoad : true,
            autoSave: true
        }),
        columns: [{header: "Employee", dataIndex: 'employee'},
                    {header: "Department", dataIndex: 'department'}]
    });

    MyEmployeeGrid.superclass.initComponent.apply(this, arguments);
} //eo function initComponent

,onRender:function() {
    MyEmployeeGrid.superclass.onRender.apply(this, arguments);
} //eo function onRender

});

Ext.reg('myemployeegrid', MyEmployeeGrid);
InformationsquelleAutor James | 2011-01-14

3 Kommentare

  1. 1

    myCustomParam ist eine Eigenschaft des Objekts in Frage. Es wird nie erklärt, wie eine variable in seinem eigenen Recht. Sie können dies durch ausführen des Codes durch jslint.

    Du willst this.myCustomParam.

    Wenn Sie versuchen, übergeben Sie in den Parametern, jedoch, möchten Sie vielleicht versuchen, auf diese Weise statt:

    MyGrid = Ext.extend(Ext.grid.GridPanel, {
      constructor: function(cfg) {
        cfg = cfg || {};
    
        //... do stuff ...
    
        MyGrid.superclass.constructor.call(this, cfg);
      }
    });
    • Danke für deine Antwort. Würden Sie bitte klären, wie instantiieren MyGrid mit dem Konstruktor. Ist es einfach new MyGrid({ customParam: "value" });? Wie wärs mit xtype?
    • Ich habe aktualisiert es so, dass, dass die Methode oben funktionieren wird. Jede Eigenschaft in der cfg Gegenstand wird eine Eigenschaft auf das neue Gitter. Wenn Sie sich registrieren MyGrid Sie wäre in der Lage, um zu konstruieren ein mit xtype. (d.h. Ext.reg(MyGrid, 'my-grid');)
    • +1 für Konstruktor Vorschlag. Ich glaube Konstruktor-Funktion ist Ext 3.x+ bevorzugte Weg erstellen Sie Ihre eigene Komponente. Die Extern-code, der es verwendet.
    • Es gibt keine Notwendigkeit, der Konstruktor überschrieben, es sei denn, Sie planen, über die Umsetzung von einigen code in es. Hinzufügen configs direkt auf der Klasse ist nur fein, und wird bevorzugt für die Dinge, die wirklich sind configs (und sollte in der Lage sein Satz aus dem Aufruf-code). Als ein beiseite, die Linie cfg = cfg || {} ist nur erforderlich, wenn Sie planen, etwas hinzuzufügen, zu cfg. Wie geschrieben sind in diesem code die Zeile ist sinnlos.
    • Ich habe nichts kopiert seinen code aus initComponent weil ich dachte, es war klar, das zu tun. Ich werde fügen Sie ein „Zeugs“ Kommentar zu machen, dass klarer. Ebenfalls zu verwenden cfg nach der Bewachung gegen Sie wird nicht definiert. Ich habe gerade den Eindruck, dass er versucht zu verstehen, wie man Variablen in initComponent nennen.
  2. 0

    Ich habe ein starkes Gefühl, dies zu tun, mit dem Bereich um den Punkt, an dem getDwrArgsFunction genannt wird. Es möglicherweise nicht wissen, was myCustomParam ist (trotz der Tatsache, das sollte vielleicht diese.myCustomParam, und dass Sie wollen, stellen Sie diese, nachdem Sie mich beworben hatte jede config), denn es ist nicht deklariert, in der DwrProxy Objekt und hat keinen Bezug zu seinem Besitz MyEmployeeGrid Objekt.

    Würd ich das Debuggen/beheben in der folgenden Weise:

    1. Umbenennen myCustomParam zu
      diese.myCustomParam und test
    2. Legen Umfang und test
    3. Erstellen getDwrArgsFunction mit
      createDelegate
      (http://dev.sencha.com/deploy/dev/docs/source/Function.html#method-Ext.util.Functions-createDelegate)
      und test

    HAFTUNGSAUSSCHLUSS: Einige von denen nicht gute, je nach Ihrer DwrProxy etc (die wir nicht sehen können, der code für)

  3. 0

    Den proxy keinen Zugriff auf die variable, da es nicht definiert ist, in den Anwendungsbereich der proxy selbst. Ich habe Schwierigkeiten mit Dinge wie diese in der Vergangenheit dachte ich, dass die Komponenten handeln würde, wie Verschlüsse und verfolgen Sie die variable, aber Sie nicht.

    Können Sie Ihr problem lösen, indem er den Umfang des Gitters, um die handler-Funktion explizit, indem es eine Stellvertretung, was Sie tun müssen, um für den Wandel ist, dass die variable, die Sie möchten den Zugriff auf eine Instanz-variable anstatt nur eine lokale variable.

    Änderungen:

    MyEmployeeGrid = Ext.extend(Ext.grid.GridPanel, {
        myCustomParam: "defaultValue",
        initComponent:function() {
        ...
        //Store Proxy
        var dwrProxy = new Ext.ux.data.DwrProxy({
                apiActionToHandlerMap : {
                read : {
                    dwrFunction : EmployeeService.readCompanyEmployees,
                    getDwrArgsFunction: function(request, recordDataArray, oldRecordDataArray) {
                        return [this.myCustomParam];
                    }.createDelegate(this)
                }
            }
        });
    
    var myGridInstance = new MyEmployeeGrid({ myCustomParam: 'ValueForThisInstance' });

    Hoffe das hilft dir, viel Glück

    • Hallo Rob, vielen Dank für deinen Beitrag. Bedeutet das, dass ich nicht in der Lage zu ändern myCustomParam beim erstellen des raster – muss ich erstellen Sie eine Instanz der MyEmployeeGrid für jedes Unternehmen, deshalb ändern myCustomParam bei der Deklaration der grid
    • Hallo James, ich änderte den code ein bisschen, weil es falsch war, die Variablen-Deklaration nicht notwendig „dies“, bevor es. Durch die Verwendung der oben genannten können Sie einen Standardwert für die variable und überschreiben Sie es mit einem benutzerdefinierten eins während der Initialisierung der Instanz Sie. Hoffe es hilft, lass es mich wissen

Kostenlose Online-Tests