Ich muss also eine ExtJS-Komponente (Version 2.3.0) erstellen. Die Komponente ist einfach nur HTML (gestylt) - es ist eine Überschrift.

Mein derzeitiger Ansatz besteht darin, eine benutzerdefinierte Komponente wie folgt zu erstellen:

/**
 * A ExtJS component for a header for the application
 */
Ext.ux.AppHeader = Ext.extend(Ext.Component, {

    height: 32,

    tpl: new Ext.Template ('<div class="title-bar"><h1>My App</h1></div>'),

    onRender: function(ct) {
        this.el  = this.tpl.append (ct);
        Ext.ux.AppHeader.superclass.onRender.apply(this, arguments);
    }
});

Ext.reg('AppHeader', Ext.ux.AppHeader);

Das funktioniert gut, aber ich bin nicht überzeugt, dass es der "richtige" Weg ist, dies zu tun. Wenn irgendjemand einen idiomatischeren Weg finden kann, oder einen Weg, der etwas innere Magie in ExtJS besser nutzt, wäre das großartig.

Wenn dies auf der anderen Seite der "richtige" Weg ist, sei dies ein Beispiel dafür, wie man es kann.

Bearbeiten

Ich habe definitiv versucht, mich mit diesem Ding anzustrengen. Ich gehe jetzt wie folgt vor:

{
  html: '<div class="title-bar"><h1>My App</h1></div>'
}

Definieren Sie das CSS für die Titelleiste, damit der Text den richtigen Stil und die richtige Größe hat und ExtJS das Richtige tut.