ext怎么在panel里面增加一棵树?

ext怎么在panel里面增加一棵树?
Ext.onReady(function(){
new Ext.Panel({
renderTo:"hello",
title:"",//面板头部header
width:300,
height:500,
border:false,
layout:"border",
items:[
{region:"south",
height:400,
width:100,
id:'panel_hello',
title:"t1",
border:false,
titleCollapse:false,//标题栏任何地方可点击
hideCollapseTool:false,//不显示右上角上的收缩按钮
collapsible:false,//右上角上的那个收缩按钮,设为false则不显示
frame:false,
collapsed:true,//如果为true,将panel渲染成收缩的,否则渲染成展开的(默认值为 false).
bodyStyle:"background-color:#313538;padding:10 0 10 0",//改变panel的底色
html:'111'},
{region:"center",
title:"t2",
border:false}
]
});
});

Ext.onReady(function() {
var tree = new Ext.tree.TreePanel({
title :"test",
width :300,
height :450,
useArrows :true,// 是否使用箭头样式
autoScroll :true,// 滚动条
animate :true,// 展开,收缩动画
rootVisible :false,// 根节点是否可见
lines :false,// 禁止显示树的虚线
root :new Ext.tree.AsyncTreeNode({
text :"all",
children :[{
text :"aaa",
checked :false,
children :[{
text :"bbb",
checked :false,
children :[{
text :"新增",
id :"aaa",
checked :false,
leaf :true
},{
text :"修改",
checked :false,
leaf :true
},{
text :"删除",
checked :false,
leaf :true
},{
text :"刷新",
checked :false,
leaf :true
}]
},{
text :"ddd",
checked :false,
children :[{
text :"新增",
checked :false,
leaf :true
},{
text :"修改",
checked :false,
leaf :true
},{
text :"删除",
checked :false,
leaf :true
},{
text :"刷新",
checked :false,
leaf :true
}]
}]
},{
text :"ccc",
checked :false,
children :[{
text :"eee",
checked :false,
children :[{
text :"新增",
checked :false,
leaf :true
},{
text :"修改",
checked :false,
leaf :true
},{
text :"删除",
checked :false,
leaf :true
},{
text :"刷新",
checked :false,
leaf :true
}]
}]
}]
})
})
var views = new Ext.Panel({
width :300,
height :450,
border :true,
renderTo :Ext.getBody(),
items :[tree],
tbar :[{
text :"保存",
icon :"/hims/resources/images/icons/save.gif",
cls :"x-btn-text-icon",
handler :function() {
}
},"-",{
text :"刷新",
icon :"/hims/resources/images/icons/reload-green.png",
cls :"x-btn-text-icon",
handler :function() {
}
}]
});
})