jsonTree

来源:互联网 发布:360手机数据恢复 编辑:程序博客网 时间:2024/06/08 04:11

把扁平化的数据转为成树形结构的Json数据。

API

jsonTree(data, config)

  • data: 数组,扁平化数据
  • config: 配置对象
    • id 数据里的id string类型
    • pid 数据里的父id string类型
    • children 生成结果中子节点的字段名 string类型
  • 返回一个树形结构的对象

方法

var jsonTree = function (data,config) {  //1  var id = config.id || 'id',      pid = config.pid || 'pid',      children = config.children || 'children';      var idMap = [],      jsonTree = []; //2  data.forEach(function(v){    idMap[v[id]] = v;  });  //3  data.forEach(function(v){    var parent = idMap[v[pid]];    if(parent) {      !parent[children] && (parent[children] = []);      parent[children].push(v);    } else {      jsonTree.push(v);    }  });  return jsonTree;};

数据

var data = [   {"id":1,"parent":0,"addr":"重庆"},   {"id":11,"parent":1,"addr":"重庆"},   {"id":12,"parent":1,"addr":"重庆"},   {"id":121,"parent":12,"addr":"重庆"},   {"id":2,"parent":0,"addr":"重庆"},   {"id":21,"parent":2,"addr":"重庆"},   {"id":211,"parent":21,"addr":"重庆"},   {"id":3,"parent":0,"addr":"重庆"},   {"id":4,"parent":0,"addr":"重庆"},   {"id":31,"parent":3,"addr":"重庆"},   {"id":32,"parent":3,"addr":"重庆"}];

调用

//调用var result = jsonTree(data, {    id: 'id',    pid: 'parent',    children: 'list'});console.log(result)console.log(JSON.stringify(result, null, '\t'));

解析

  • 第一段
    • 声明了变量,拿到传参过来的值,注意这里拿到的是string类型,不是对应的值
  • 第二段
    • v[id]==v[“id”]==v.id
    • idMap数组的下标对应着id为下标的相应json数据
    • a[1]对应着id为1的json数据,以此类推
  • 第三段
    • 拿到当前遍历的父元素id
    • 根据父元素id,判断数组里是否存在这样一条数据
    • 存在,就判断父元素是否有子元素数组,若没有就添加一个children数组(传参过来的)
      把当前元素添加父元素的children数组里
    • 不存在,就直接添加到jsonTree里

源码

  • GitHub:https://github.com/aximario/ax-json-tree
原创粉丝点击