請問extjs tree 問題

Question

[code="java"]var menuTree = new Ext.tree.TreePanel({
region:'west',
title:'選單',
width:180,
minSize:150,
maxSize:200,
split:true,
autoScroll:true,
autoHeight:false,
collapsible:true,
rootVisable:true,
root:new Ext.tree.TreeNode({
id:'root',
text:'訪客人數',
draggable:false,
expanded:true
})

});

menuTree.root.appendChild(new Ext.tree.TreeNode({
id:'htmlPanel',
text:'選單A',
listeners:{
'click':function(node, event) {
event.stopEvent();
var n = contentPanel.getComponent(node.id);
if (!n) { //判断是否已经打开该面板
n = contentPanel.add({
'id':node.id,
'title':node.text,
closable:true, //通过html载入目标页
html:''
});
}
contentPanel.setActiveTab(n);
}
}
}));

menuTree.root.appendChild(new Ext.tree.TreeNode({
id:'htmlPanel2',
text:'選單B',
listeners:{
'click':function(node, event) {
event.stopEvent();
var n = contentPanel.getComponent(node.id);
if (!n) { //判断是否已经打开该面板
n = contentPanel.add({
'id':node.id,
'title':node.text,
closable:true, //通过html载入目标页
html:''
});
}
contentPanel.setActiveTab(n);
}
}
}));

menuTree.root.appendChild(new Ext.tree.TreeNode({
id:'htmlPanel3',
text:'選單C',

listeners:{
'click':function(node, event) {
event.stopEvent();
var n = contentPanel.getComponent(node.id);
if (!n) { //判断是否已经打开该面板
n = contentPanel.add({
'id':node.id,
'title':node.text,
closable:true, //通过html载入目标页
html:''
});
}
contentPanel.setActiveTab(n);
}
}
}));[/code]
請問要如何精簡掉重複的程式碼
點
選單A 會開啟 a.html
選單B 會開啟 b.html
選單C 會開啟 c.html

Answer 1

你的树可以通过json一下子加载或逐级加载，不用一个节点一个节点加个root。
然后树有个click事件，
tree.on("click", function(node) {
addTab(node);//这边写加入到tabpanel的代码，id与url的可以从node的属性来
});