Question

我正在尝试从viewcontroller中启动一个模态窗口。请考虑以下代码（也位于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函数将正确记录窗口2对象。我试图在窗口2上设置renderTo: Ext.getBody();但是，渲染时我无法访问它的对象。在这种情况下，htmlRender会记录一个＆＃34; undefined＆＃34;对于窗口2对象。

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

Answer 1

我能够通过在窗口上设置renderConfig:Ext.getBody()，删除html项上的侦听器并在window2上为show事件添加侦听器来解决此问题：https://fiddle.sencha.com/#fiddle/133j

Answer 2

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

'Active'

使用：

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

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

ExtJS6从ViewController启动模态窗口

2 个答案: