var tabs = Ext.create("Ext.tab.Panel",{
width:300,
height:200,
activeTab:0,
items:[{
title:"Home",
itemId:"home",
html:"Home"
},{
title:"User",
itemId:"user",
html:"user",
//hidden:true
},{
title:"Tickes",
itemId:"tickes",
html:"tickes"
}],
renderTo:Ext.getBody()
});
setTimeout(function(){
tabs.child("#home").tab.hide();
var user = tabs.child("#user");
user.tab.show();
tabs.setActiveTab(user);
},1000);
extjs4 和 extjs3.x 在创建对象的时候有个明显的区别,那就是:extjs4 用Ext.create()来生成对象。
tabpanel 的常用属性:
tabPosition: 设置tab的位置,
下面来学习item常用的属性:
title: 标题
itemId: item的 id
html:页面显示的内容,可以是普通字符和html代码
hidden:设置item是否隐藏
tabpanel 的方法
child():获取tabs的子节点,参数为itemId。
var user = tabs.child("#user");
user.tab.show();
tabs.setActiveTab(user);
如上:可以通过id=“user”来获取tabs的子节点,在通过子节点获取tab。
并且可以通过 tabs.items.items[0]这样的语句来获得tab。
close():关闭一个tab,如下面代码,关闭第一个tab
tabs.items.items[0].close();
add():增加一个tab
remove():删除一个tab