使用fuelux tree

 

bootstrap这么火，就是fuelux又是同一家推出的一组控件，所以就试着使用了一下fuelux，第一个用的就是tree，谁知这个tree就让我废了好几天功夫，不过最后总算搞定了，鉴于百度不到什么有用的东西，就简单写一下我的心得吧

 

fuelux的官方文档写的很简单，tree要提供一个dataSource如下：

 

dataSource = function(parentData, callback){
  //...
};

$('#myTree').tree({ dataSource: dataSource });

 

我几经周折才搞明白这个dataSource的用法：

 

tree是在每次展开一个新的节点时调用这个dataSource的，其中parentData是要展开的这个节点的数据，我们需要根据这个dataSource组织这个节点的分支的数据，这个数据要包含一个data属性，data是一个数组，就是这个节点的所有子节点，然后以这个数据作为参数调用callback就可以了

 

完整的代码不好抽出来，伪代码如下：

 

dataSource = function(parentData, callback){
  var children = 根据parenData算出的节点数据
  callback(children);
};