Ext2.0中tab iframe的配置

在ext 1.1 中 实现tabpanel加iframe很是简单,只要使用如下代码就可以在一个tabpanel加入一个iframe

Ext.DomHelper.append(document.body,
... {tag:'iframe',id:id,
frameBorder:0,scrolling:'auto',
src:url,name:id,
style:'width:100%;height:600px;'} );
return tabFrame;

然而在ext2.0中使用该代码怎么都不显示效果，而且代码也不抱错.郁闷了很久，最后终于在老外的一个论坛上找到了解决方案

首先在 ext-all.js 拉到最后插入代码

Ext.ux.IFrameComponent = Ext.extend(Ext.BoxComponent, {
onRender : function(ct, position){
this.el = ct.createChild({tag: 'iframe', id: 'iframe-'+ this.id, frameBorder: 0, src: this.url});
}
})

然后在页面中可以这么调用

var szPanel = viewport.findById(id);
if (szPanel == null )
... {
szPanel=newExt.Panel(...{
id:id,
title:t,
closable:true,
layout:'fit',
items:[newExt.ux.IFrameComponent(...{id:id,url:url})]
});
tabs.add(szPanel); 这里有个地方要注意 layout:'fit'这个选项是 必须的不然ifame 就不知道在哪了