如何使用extjs在Widget中实现Tab面板？

Question

I'm trying to implement TAB-panel inside widget.

i can see it, but totally in wrong place... here is the Code of VIEW how can i place it inside widget.TESTusersettings????

I suppose renderTo: Ext.getBody() is not correct here... whar do you mean?

Ext.define("TEST.view.settings.UserSettings", {
    extend: "Ext.window.Window",
    alias: "widget.TESTdusersettings",

    requires: [
        "TEST.overrides.LocalComboBox",
        "TEST.common.LocaleManager",
        "Ext.form.Panel"
    ],

    width: 600,
    height: 300,
    border: false,
    closeAction: "hide",
    resizable: false,

    layout: "fit",

    title: 'User Settings',


    initComponent: function() {
        debugger;
        Ext.create('Ext.tab.Panel', {
            width: 300,
            height: 200,
            activeTab: 0,
            items: [
                {
                    title: 'Userdata',
                    bodyPadding: 10,
                    html: 'A simple tab'
                },
                {
                    title: 'Connections',
                    html: 'Connections one'
                },
                {
                    title: 'Payment',
                    html: 'Payment one'
                },
                {
                    title: 'Bills',
                    html: 'Bills one'
                }
            ],
            renderTo: Ext.getBody()
        });
    }

});

Answer 1

Change the init to this.

initComponent: function() {
    var me = this;
    Ext.applyIf(me, {
        items: Ext.create('Ext.tab.Panel', {
            activeTab: 0,
            items: [
                {
                    title: 'Userdata',
                    bodyPadding: 10,
                    html: 'A simple tab'
                },
                {
                    title: 'Connections',
                    html: 'Connections one'
                },
                {
                    title: 'Payment',
                    html: 'Payment one'
                },
                {
                    title: 'Bills',
                    html: 'Bills one'
                }
            ]
        })
    });

    me.callParent(arguments);
}