使用dojo的tree

dojo的Tree非常是灵活，可是官方站点上的样例却非常少，并且也比較分散，兴许将持续完好本样例。

总的来说，要使用tree，要接触到三个类："dojo/store/JsonRest","dijit/tree/ObjectStoreModel","dijit/Tree"。

通过JsonRest异步从服务端获取数据。

ObjectStoreModel能够设置推断当前数据是否有子结点的方法、数据中哪个属性用来作为label显示在树中，数据使用什么图标显示等。

Tree详细显示树。

var usGov = new JsonRest({
target : "/rest/getTreeData",//获取树数据的URL
getChildren : function(object) {//怎样获取下级数据，这里与官方样例里的不一样，官方样例里要求返回的数据信息中要同一时候返回当前结点数据，大多数情况下这个是多余的，使用以下的程序， 服务端仅仅须要返回下级结点数据的数组就可以。
if (typeof object.children == "undefined") {//这段程序，推断到当本结点的数据的下级数据已经有了后，就不须要再从服务端获取了。
return this.query({PID:object.ID}).then(function(fullObject) {
return fullObject;
});
} else {
return object.children;
}
}
});
// create model to interface Tree to store
var model = new ObjectStoreModel({
store : usGov,
//query: {PID: "root"},//通常情况下这个是不须要设置的，假设不设置，从服务端获取根结点数据时将不传參数
mayHaveChildren : function(object) {//推断数据是否有儿子，当结点展开时是否会调用上面store中的getChildren方法，就是通过这种方法推断的
return !object.leaf;//本处于官方样例不一样，并非复用children属性的，程序更为清析。
},
getLabel : function(object) {//数据对象中个属性是用来显示在树结点中的。
return object.NAME;
}
});<pre name="code" class="javascript">var tree = new Tree({
model : model,
persist : false,
showRoot : true,
region : 'center',//假设父容器是BorderContainer，指定树显示在该父容器中间
style : "overflow:hide;padding:0px;"
});

本树结点第一次从服务端获取根结点的数据样例：

<pre name="code" class="javascript">[{NAME: "US Government",
  id: "a1",ID:"1",
  leaf:false,
  children:[{
           NAME: "Congress2",
           id: "a2",
           ID:"2",
           leaf:false
          },{
           NAME: "Congress3",
           id: "a3",
           ID:"3",
           leaf:true
          }]
}]

</pre><pre code_snippet_id="500089" snippet_file_name="blog_20141028_20_3872161" name="code" class="javascript">展开树中Congress2结点时从服务端获取的数据样例：

<pre name="code" class="javascript">[{ NAME: "Congress4",
     id: "a4",
      ID:"4",
      leaf:false,
      children:[{
                   NAME: "Congress6",id: "a6",ID:"6",leaf:true},
                  {NAME: "Congress7",id: "a7",ID:"7",leaf:true}]},
      {NAME: "Congress5",id: "a5",ID:"5",leaf:true}]

特别要注意，数据中的id属性一定要有，而且不能反复，否则在结点展开的时候可能不会触发从后台获取数据的动作。