ExtJS6启动模式窗口ViewController

Question

我正在尝试从一个视图控制器中启动一个模态窗口。考虑以下代码(也位于https://fiddle.sencha.com/#fiddle/1335)：

Ext.application({
    name : 'Fiddle',
    launch : function() {
        Ext.define('Window1',{
            extend: 'Ext.window.Window',
            controller: 'winctrl',
            xtype: 'window1',
            initComponent: function(){
                Ext.apply(this,{
                    title:'Window 1',
                    width: 400,
                    height: 400,
                    layout: {type:'hbox',pack:'center',align:'middle'},
                    items:[{
                        xtype: 'button',
                        text: 'Click Me!',
                        handler: 'btnClickMeClick'
                    }]
                });
                this.callParent(arguments);
            }
        });
        Ext.define('Window2',{
            extend: 'Ext.window.Window',
            xtype: 'window2',
            initComponent: function(){
                Ext.apply(this,{
                    title: 'Window 2',
                    width: 200,
                    height: 200,
                    modal: true,
                    //renderTo: Ext.getBody(),
                    layout: {type:'hbox',pack:'center',align:'middle'},
                    items:[{
                        html: 'Modal Looks Odd',
                        listeners:{
                            afterrender: 'htmlRender'   
                        }
                    }]
                });
                this.callParent(arguments);
            }
        });
        Ext.define('WinCtrl',{
            extend: 'Ext.app.ViewController',
            alias:'controller.winctrl',
            btnClickMeClick: function(){
                this.dialog = this.getView().add({xtype:'window2'});
                this.dialog.show();
            },
            htmlRender: function(){
                console.log(this.dialog);
            }
        });
        Ext.widget('window1').show();
    }
}); 

我遇到的问题是，当窗口2启动时，它只是对启动窗口的视图的模态，而我需要该窗口对整个文档进行模态化。如果按原样运行，htmlRender函数将正确地记录window 2对象。我试图在窗口2上设置renderTo: Ext.getBody()；但是，当呈现它的对象时，我无法访问它的对象。在本例中，htmlRender记录窗口2对象的“未定义”。

我需要一些帮助，允许将窗口2呈现为文档的模式，同时允许我引用它的对象。谢谢你的帮助。

Answer 1

我能够通过设置窗口上的renderConfig:Ext.getBody()、删除html项上的侦听器以及为window2：https://fiddle.sencha.com/#fiddle/133j上的显示事件添加一个侦听器来解决这个问题。

Answer 2

不要将窗口添加到该视图中，请替换：

this.dialog = this.getView().add({xtype:'window2'})

通过以下方式：

this.dialog = Ext.widget('window2');

工作示例：https://fiddle.sencha.com/#fiddle/1338