Ext.definieren/Ext.erweitern Sie in Sencha Touch 2

Ich bin gerade erst anfangen zu Holen Sencha Touch 2 MVC. Ich habe schwere Ext 3 Erfahrung, aber dies ist eine völlig neue Welt.

Ich kann nicht scheinen, um sehr weit in den Aufbau einer Sicht. Ich habe meinen code in zwei Richtungen, basierend auf dem, was ich auf dem Internet gesehen, und weder arbeitet.

Weg 1

Meine app.js:

Ext.application({
        name: 'BkAdmin',
        views: ['LoginForm'],
        launch: function() {
            Ext.create('BkAdmin.view.LoginForm');
    }
});

Meine view/LoginForm.js:

Ext.define('BkAdmin.view.LoginForm', {
        extend: 'Ext.form.FormPanel',
        config: {
            fullscreen: true,
            initComponent: function() {
                        alert('yo!');
                        BkAdmin.view.LoginForm.superclass.initComponent.apply(this, arguments);
            }
        }
    }
);

Diese Belastungen fehlerfrei, und ich kann sogar hinzufügen, Formular-Elemente, die im Abschnitt "config". Allerdings initComponent() aus unerklärlichen Gründen nie aufgerufen wird, so wird die Ansicht ist völlig unflexibel.

Weg 2

Meine app.js:

Ext.application({
    name: 'BkAdmin',
    views: ['LoginForm'],
    launch: function() {
    BkAdmin.view.LoginForm = new BkAdmin.view.LoginForm();
    }
});

Meine view/LoginForm.js:

BkAdmin.view.LoginForm = Ext.extend(Ext.form.FormPanel, {
    fullscreen: true,
    initComponent: function() {
                alert('yo!');
        BkAdmin.view.LoginForm.superclass.initComponent.apply(this, arguments);
    }
});

Diese flat-out nicht funktioniert. Chrom-Berichte " Kann set property 'LoginForm' undefined'...wie auf der Erde haben anzeigen get undefined? Darüber hinaus heißt es: "Die folgenden Klassen werden nicht deklariert, auch wenn Ihre Dateien wurden geladen: 'BkAdmin.Blick.LoginForm'.' Sieht sicher erklärt mir.

Viele Fragen hier: was habe ich falsch gemacht in die oben genannten Pfade? Wie bekomme ich initComponent() aufgerufen werden, in Pfad 1 und erhalten Weg 2 zu arbeiten? Welcher code Zitat-unquote besser zu nutzen?

Dank!

InformationsquelleAutor spamguy | 2012-03-20
  1. 7

    Weg 1 ist die (fast) richtigen Weg. Sie sollten mit Ext.define und nicht Ext.extend (was nicht funktioniert sehr gut/zuverlässig), weil die neue Klasse system (ähnlich wie bei Ext JS 4).

    Den config block ist nur für Konfigurationen, die in der Klasse definiert/Dokumentation für diese Klasse. Dinge wie fullscreen, items, cls, style und so weiter. Etwas anderes ist definiert, dass config block, der nicht eine Konfiguration wird gespeichert in instance.config.

    Stattdessen sollten Sie es sein, die Methoden, die Sie überschreiben möchten in der Haupt-Konfigurations-Objekt in Ext.define:

    Ext.define('MyApp.view.MyView', {
    extend: 'Ext.Component',

    config: {
        cls: 'custom-cls',
        html: 'Some html'
    },

    initComponent: function() {
        //do something
    }
});

    Sencha haben auch veraltet initComponent in Sencha Touch 2.0. Wenn Sie eine Methode wird aufgerufen, wenn die Klasse instanziiert wird, sollten Sie die initialize Methode. Bitte beachten Sie, dass im Idealfall Sie sollten nicht set-Konfigurationen innerhalb initialize es sei denn, Sie wirklich müssen. Sie sollten immer setzen Sie in der config block.

    Schließlich können Sie rufen Sie die erweiterte Klasse' - Methode durch den Einsatz von:

    this.callParent(arguments);

    Gibt es einen Leitfaden über die änderungen an der Klasse system zwischen Ext JS 3.x und Ext JS 4.x lieferbar hier, die möglicherweise eine Hilfe für Sie. Es gibt auch eine aktualisierte Klasse system-Handbuch für Sencha Touch 2.x hier.

    InformationsquelleAutor rdougan
Schreibe einen Kommentar