ExtJS treepanel未显示
ExtJS treepanel未显示
提问于 2014-10-30 17:55:37
因此，我做了一个简单的应用程序与4个地区，北部，东部，南部和西部。我想在西部地区加载一个树形(静态)。我为西部地区编写的代码如下：
........................
{
region: 'west',
title: 'Hierarchy',
iconCls:'icon-map',
width: 250,
items: treepanel
}
........................我的面板和商店来自文档教程，如下所示：
var store = Ext.create('Ext.data.TreeStore', {
root: {
text: "/",
expanded: true,
children: [
{ text: "detention", leaf: true },
{ text: "homework", expanded: true, children: [
{ text: "book report", leaf: true },
{ text: "alegrbra", leaf: true}
] },
{ text: "buy lottery tickets", leaf: true }
]
}
});
var treepanel = Ext.create('Ext.tree.Panel', {
title: 'Simple Tree',
width: 200,
height: 150,
store: store,
rootVisible: true,
});唯一的问题是树视图不显示..有人知道怎么解决这个问题吗？
回答 1
Stack Overflow用户
发布于 2014-10-30 18:17:15
您可以将区域添加到树面板中：
var treepanel = Ext.create('Ext.tree.Panel', {
region: 'west',
title: 'Simple Tree',
width: 200,
height: 150,
store: store,
rootVisible: true,
});在视口中，您可以将treepanel添加到项目中：
Ext.create('Ext.container.Viewport', {
layout: 'border',
renderTo: Ext.getBody(),
items: [{
region: 'north',
...
}, treepanel, {
region: 'south',
...
}, {
region: 'east',
...
}, {
region: 'center',
...
}]
});完整的工作示例：
<html lang="en">
<head>
<link rel="stylesheet" type="text/css" href="resources/css/ext-all.css" />
<script type="text/javascript" src="ext-all.js"></script>
</head>
<body>
<script>
Ext.onReady(function(){
var store = Ext.create('Ext.data.TreeStore', {
root: {
text: "/",
expanded: true,
children: [
{ text: "detention", leaf: true },
{ text: "homework", expanded: true, children: [
{ text: "book report", leaf: true },
{ text: "alegrbra", leaf: true}
] },
{ text: "buy lottery tickets", leaf: true }
]
}
});
var treepanel = Ext.create('Ext.tree.Panel', {
title: 'Simple Tree',
region: 'west',
width: 200,
height: 150,
store: store,
rootVisible: true,
renderTo: Ext.getBody()
});
Ext.create('Ext.container.Viewport', {
layout: 'border',
renderTo: Ext.getBody(),
items: [{
region: 'north',
title: 'North',
html: 'North'
}, treepanel, {
region: 'south',
title: 'South',
html: 'South'
}, {
region: 'east',
title: 'East',
html: 'East'
}, {
region: 'center',
title: 'Center',
html: 'Center'
}]
});
});
</script>
</body>
</html>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/26649857
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号