ExtJS在组合框选择上显示面板

好的，我已经定义了4个面板。每个面板都有自己的JS文件。我在主模式窗口中通过它们的别名调用它们

在我的应用程序中，我有这个组合框。我想根据组合框中的选定项显示面板

这是我的密码

主模式窗口：

Ext.define('App1.views.reports.MainReport', {
    extend: 'Ext.window.Window',
    alias: 'widget.mainreport',
    title: 'Main Report',
    width: 900,
    autoHeight: true,
    modal: true,
    items: [{
        bodyPadding: 5,
        defaults: {
            border: 0
        },
        items: [{
            xtype: 'combobox',
            fieldLabel: 'Select Report Type',
            id: 'reportType',
            labelWidth: 200,
            width: 320,
            store: reportType,
            queryMode: 'local',
            displayField: 'name',
        }, {
            //render panel here
        }]
    }],
    buttons: [{
        text: 'Done'
    }, {
        text: 'Cancel'
    }]
});

这是我的组合框商店：

var reportType = Ext.create('Ext.data.Store', {
    fields: [
        'name'
    ],
    data: [{
        'name': 'Report1'
    }, {
        'name': 'Report2'
    }, {
        'name': 'Report3'
    }, {
        'name': 'Report4'
    }]
});

因此，一旦在组合框中选择了一个项目，就会出现一个特定的面板。假设我选择了“Report1”，则会出现“Report1”面板

谢谢大家!

在组合框中添加一个侦听器。您可以在select listener函数中切换面板

{
    xtype: 'combobox',
    fieldLabel: 'Select Report Type',
    id: 'reportType',
    labelWidth: 200,
    width: 320,
    store: reportType,
    queryMode: 'local',
    displayField: 'name',
    listeners: {
        select: function(combo, records, eOpts) {
            // put in your logic to switch panel here
        }
    }

}

PS：不确定您使用的是哪个版本，指向文档的链接是针对extjs 5.0的

Add forceSelection:如果可以手动键入值，则为true。