javascript - extjs 示例代码不起作用

Question

Ext.create('Ext.panel.Panel', {
renderTo: Ext.getBody(),
width: 400,
height: 300,
title: 'Container Panel',
items: [
    {
        xtype: 'panel',
        title: 'Child Panel 1',
        height: 100,
        width: '75%'
    },
    {
        xtype: 'panel',
        title: 'Child Panel 2',
        height: 100,
        width: '75%'
    }
]
});

上面的代码没有被执行......你能找到错误或错误吗？我对 extjs 很陌生。我在浏览文档时发现了上面的代码（检查“容器”部分）。它在jsfiddle中执行良好，但在我的项目中却没有。（其他示例在我的项目中运行良好）。

回答：

Ext.onReady(function(){
    Ext.create('Ext.panel.Panel', {
        renderTo: Ext.getBody(),
        width: 400,
        height: 300,
        layout: 'hbox',
        title: 'Container Panel',
        items: [
           {
               xtype: 'panel',
               title: 'Child Panel 1',
               height: 100,                
               flex:1
           },
           {
               xtype: 'panel',
               title: 'Child Panel 2',
               height: 100,
               flex:1
           }
       ]
   });
});

Answer 1

几个问题：

1）您需要将代码包装在 onReady 块中。

2) 宽度无效。他们怎么可能都是75%？在这种情况下，您将需要使用 hbox 布局，每个子项都是 flex: 1。