extjs 3.31 TreeGrid实现静态页面加载json到TreeGrid里面

150 阅读 0 评论 99 点赞

我是靠谱客的博主耍酷星星，最近开发中收集的这篇文章主要介绍extjs 3.31 TreeGrid实现静态页面加载json到TreeGrid里面，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

想要实现 TreeGrid的效果，打开官方例子却看不到效果，怎么办呢？我是这样实现的

复制代码代码如下:

 
var root = new Ext.tree.TreeNode({ 
text: '根节点', 
expanded: true 
}); 
tree.setRootNode(root); 
var nodes = {}; 
nodes.children = mydata;/*TreeGrid的json数据[{……},{……}]*/ 
function appendChild(node, o) { 
if (o.children != null && o.children.length > 0) { 
for (var a = 0; a < o.children.length; a++) { 
var n = new Ext.tree.TreeNode({ 
task:o.children[a].task, 
duration:o.children[a].duration, 
user:o.children[a].user, 
iconCls:o.children[a].iconCls 
}); 
node.appendChild(n); 
appendChild(n, o.children[a]); 
} 
} 
} 
appendChild(root, nodes); 

看源码我们知道 TreeGrid 继承于 TreePanel
所以 root 才是数据源而不是 store,
根据加载json数据到树的原理，同理我们可以这样加载json数据到 treeGrid,而不再为dataUrl: 'treegrid-data.json'这样的加载方式而烦恼了，是不是很简单呢？