Was ist die syntax zum hinzufügen eines Bedienfelds zu einer viewport-Komponente?

Aus den Beispielen, die ich gefunden habe, sollte dieser code fügen Sie die newPanel zu viewport als seine Ost-region, aber es tut sich einfach nichts:

var viewport = new Ext.Viewport({
    layout: 'border',
    items: [ regionMenu, regionContent ]
});

var newPanel = new Ext.Panel({
    region: 'east',
    width: 300,
    html: 'this is a panel that is added'
});
viewport.add(newPanel);

Wie kann ich ein neues panel an ein viewport?

Nachtrag

Ich habe es zu arbeiten, hier ist der Haupt-code für diejenigen, die mit dem gleichen Problem, ich bin mir nicht hinzufügen, um den viewport sondern auf die region innerhalb des Arbeitsbereichs, und ich leere die region von deren Inhalt vor, die ich hinzufügen neuer Inhalte:

Ext.onReady(function(){

    ...

    regionContent = new Ext.Panel({
        id: 'contentArea',
        region: 'center',
        padding:'10',
        autoScroll: true
    });

    var viewport = new Ext.Viewport({
        layout: 'border',
        items: [ regionMenu, regionContent ]
    });

    clearExtjsComponent(regionContent);
    var start_info_panel = new Ext.Panel({
        title: 'Start Info',
        padding: 10,
        width: 300,
        html: 'this panel was added from the start view'
    });
    regionContent.add(start_info_panel);
    regionContent.doLayout();

});


function clearExtjsComponent(cmp) {
    var f;
    while(f = cmp.items.first()){
        cmp.remove(f, true);
    }
}