在destoy之后,Extjs窗口歪斜

Question

如果你按照这个向导http://jsfiddle.net/8tBKa/,你会看到.
按钮1打开一个窗口.
按钮2摧毁它.
按钮3重新创建窗口.

娱乐后,窗户歪斜.

Ext.define('MyWindow', {
    extend : "Ext.window.Window",
    title: 'Hello',
    height: 200,
    width: 400,
    closeAction: 'destroy',
    layout: 'fit',
    items: Ext.create('Ext.form.Panel', {              
        xtype: 'form',
        itemId: "Window",
        defaults: {
            labelAlign: 'top',
            msgTarget: 'side',
            labelWidth: 150,
            columnWidth: .33,
            padding: "10px 30x 10px 10px"
        },
        layout: {
            type: 'column',
            columns: 3,
            align: 'stretch'
        },
        items: {
            xtype: 'textfield',
            width: 100,
            fieldLabel: "Some input"
        }
    })

});

var win = false;
function show(){
    win = Ext.create("MyWindow");
    win.show();
}
function close(){
    win.close();
}

Ext.onReady(function () {
    Ext.create('Ext.Panel', {
        title : "Panel",
        renderTo: Ext.getBody(),
        items: [
            {xtype : "button", text : "Step 1 (Create window)", handler : show },
            {xtype : "button", text : "Step 2 (Destroy window)", handler : close },
            {xtype : "button", text : "Step 3 (Create NEW window)", handler : show }
        ],
    });
});

更新1

感谢您的信息,但是,如果我想从窗口构造函数访问该窗体,我实际上不能.
如果将以下功能添加到窗口:

constructor: function () {
    this.items[0].getForm().load({/*bla bla*/});
    this.callParent();
}

我会收到一个错误: Uncaught TypeError: Object #<Object> has no method 'getForm'
(http://jsfiddle.net/8tBKa/2/)

Answer 1

在定义类时不要使用Ext.create.这意味着窗体实例将在窗口实例之间共享.因此,一旦窗口被破坏,窗体也将被破坏,窗口仍然存在.

相反,只需使用xtype附加的配置.