json - 如何使用生成的 json 构建 extjs 窗口？

Question

我用ExtDesigner设计了一个窗口，生成的json是这样的：

{
    xtype: 'window',
    height: 477,
    width: 666,
    layout: 'fit',
    title: '添加广告位',
    items: [
        {
            xtype: 'form',
            bodyStyle: 'padding: 10px',
            title: '',
            items: [
                {
                    xtype: 'textfield',    
                    anchor: '100%',
                    fieldLabel: '名称'
                },
                {
                    xtype: 'radiogroup',
                    anchor: '100%',
                    fieldLabel: '广告类型',
                    items: [
                        {
                            xtype: 'radio',
                            boxLabel: '文字'
                        },
                        {
                            xtype: 'radio',
                            boxLabel: '图片'
                        }
                    ]
                }
            ]
        }
    ]
}

我复制了它，但我不知道如何使用它。我没有找到将其转换为 extjs 组件的方法。怎么做？

PS：我使用 extjs 2.2

Answer 1

有两种方法可以创建 ExtJS 组件。

1. 显式创建组件，例如：new Ext.Window({...});. 这样您就可以立即获得组件，这意味着事件侦听器、额外的方法……等等。

2. 第二种方法是延迟加载，即通过xtype在纯 javascript 对象中指定组件的。这正是你所拥有的。

为了使第二种方式工作，您需要将您的 xtype-javascript-object 包含在 ExtJs 容器中，并且容器将知道如何在适当的时间呈现它。

例如 ：

Ext.onReady(function(){
    new Ext.Viewport({
        layout : 'fit',
        items : [{
            xtype: 'window',
            height: 477,
            width: 666,
            layout: 'fit',
            title: '添加广告位',
            items: [...]
        }]
    });
});

Answer 2

认为您正在寻找这样的东西。这将在弹出窗口中显示您的窗口。

var win = new Ext.Window({
width:400
,id:'autoload-win'
,height:300
,autoScroll:true
});
win.show();