Question

我有一个Window，我想为它添加一个面板。我的代码如下;我看到窗户而不是面板。为什么我的代码没有显示面板？

然后我想为每个面板着色。它也不起作用。

Ext.define('Sports.view.WelcomeWindow', {
    extend: 'Ext.window.Window',
    alias : 'widget.welcomewin',
    layout:'fit',
    defaults: {
    bodyStyle: 'padding:10px'
    },
    items: [panel1]
    });
//column.show();
var panel1 = Ext.create('Ext.panel.Panel', {
    title: 'Panel 1',
    html: 'Body 1',
    id: 'panel1Id',
    columnWidth: .25, //means 25%
    height: 120
    });

var resultQuery = Ext.ComponentQuery.query('panel');
var colors = ['#ACFA8A','#F4FA8A','#FAB38A','#8AE9FA','#CA8AFA'];
for (var i = 0; i < resultQuery.length; i++) {
resultQuery[i].body.highlight(colors[i], {duration: 10000});
}

Answer 1

定义panel1时，

WelcomeWindow不在范围内。配置属性通常需要Ext.create引用或（更好）组件配置对象。所以你有两个选择：

Ext.define('Sports.view.WelcomeWindow', {
    extend: 'Ext.window.Window',
    alias : 'widget.welcomewin',
    layout:'fit',
    defaults: {
        bodyStyle: 'padding:10px'
    },
    items: [
        Ext.create('Ext.panel.Panel', {
            title: 'Panel 1',
            html: 'Body 1',
            id: 'panel1Id',
            columnWidth: .25, //means 25%
            height: 120
        }) 
    ]
});

或者更好的一个：

Ext.define('Sports.view.WelcomeWindow', {
    extend: 'Ext.window.Window',
    alias : 'widget.welcomewin',
    layout:'fit',
    defaults: {
        bodyStyle: 'padding:10px'
    },
    items: {
            xtype: 'panel',
            title: 'Panel 1',
            html: 'Body 1',
            id: 'panel1Id',
            columnWidth: .25, //means 25%
            height: 120
    }
});

此外，从实际创建窗口时提供的代码中不清楚，因此，由于尚未创建窗口，因此颜色设置可能会失败。

窗口不显示其中的面板

1 个答案: