ExtJs5如何将浮动窗口作为项目添加到面板中

ExtJs5 How to add a floating window to a panel as an item?

本文关键字:添加 项目 窗口 ExtJs5      更新时间:2023-09-26

我正在用MVVM结构编写应用程序。我在GeoPortal.geox.components.MapToolbar中有按钮作为项目。在我的视图(GeoPortal.view.map.map)中,我使用这个工具栏,工具栏的按钮在我的viewController(GeoPorter.view.map.MapController)中有操作。现在这个工具栏必须是浮动的,所以我把它放在一个浮动窗口中。但要访问按钮操作,该窗口必须是面板中的一项。

我试图在下面的代码中添加类似的项目,但我得到了这个错误:

TypeError: me.floatingItems is undefined

GeoPortal.view.map.map:

Ext.define("GeoPortal.view.map.Map",{
    "extend": "GeoPortal.geox.components.Panel",
    "controller": "map",
    "viewModel": {
        "type": "map"
    },
    "uses": ['GeoPortal.geox.components.MapToolbar',
        'GeoPortal.geox.components.MapInfobar',
        'GeoPortal.geox.components.Window'
    ],
    initComponent: function () {
        var win = Ext.create({
            xtype: 'gxWindow',
            id: 'mapToolbarWindow',
            items: [{
                xtype: 'gxMapToolbar'
            }]
        });
        // FIX this
        this.add(win);
        this.callParent();
    },
    listeners : {
        afterrender: {
            fn: function () {
                Ext.getCmp('mapToolbarWindow').show();
            }
        }
    },
    "region": 'center',
    "collapsible": false,
    "collapsed": false,
    "xtype": "mapPanel",
    items: [{
        xtype: 'gxMapInfobar'
    }, {
        html: '<div id="map" class="map"></div>'
    }]
});

提前谢谢。

您可以只存储对窗口this.win = Ext.create({ xtype: 'gxWindow' })的引用。然后,您可以随时使用。如果您还需要对窗口中的面板进行引用,请将其传递到窗口配置:this.win = Ext.create({ xtype: 'gxWindow', panel: this })中。

另外,你们应该注意,当面板被破坏时,你们应该破坏窗口,否则你们会有潜在的内存泄漏。