关于项目中tree数据的处理展示，常见的2种处理方法(前端和后端)

1：后端处理方法：

tree结构：

思路：后端通过循环拼接tree数据返回给前台

在这里插入代码片
//数据库返回list
List<UnidocMenu> list = unidocMenuMapper.selectByExample(example);

Map<String, Object> map = new HashMap<String, Object>();
List<Map<String, Object>> rusult = new ArrayList<Map<String, Object>>();
for (UnidocMenu item : list) {
    if ("-1".equals(item.getParentId())) {
        map = new HashMap<String, Object>();
        map.put("id", item.getMenuId().toString());
        map.put("label", item.getMenuName());
        map.put("isEdit", false);
        this.getSonTree(map, list);
        rusult.add(map);
    }
}

resultMap.put("respCode", "00000");
resultMap.put("respDesc", "查询目录成功");
resultMap.put("result", rusult);

//无限循环方法

private Map<String, Object> getSonTree(Map<String, Object> map, List<UnidocMenu> list) {
    List<Map<String, Object>> sonList = new ArrayList<Map<String, Object>>();
    Map<String, Object> sonMap;
    for (UnidocMenu item : list) {
        if (map.get("id").toString().equals(item.getParentId())) {
            sonMap = new HashMap<String, Object>();
            sonMap.put("id", item.getMenuId().toString());
            sonMap.put("label", item.getMenuName());
            sonMap.put("isEdit", false);
            sonList.add(sonMap);
            this.getSonTree(sonMap, list);
        }
    }
    map.put("children", sonList);
    return map;

}

1.2：后台封装对象返回

代码如下：bean对象

定义公共处理类

调用方法：

参考博客

2. 前台处理方法：

在这里插入代码片

$("tree-menu").tree({

    loadFilter : function(data, parent) {
        var tree=[];
        //加载父节点
        for(var i=0;i<data.length;i++) {//为每个节点赋予id，text
            data[i].id = data[i].menuId;//为id属性赋值，已有可略过
            data[i].label= data[i].menuName;//为text属性赋值
            data[i].children=[];//初始化children属性
            if(!data[i].parentId||data[i].parentId==""){//加载一级节点
                tree.push(data[i]);
            }
        }
        //加载子节点
        for(var i=0;i<data.length;i++){
            for(var j=0;j<data.length;j++){//找到data[i]的父节点data[j]
                if(data[i].parentId==data[j].id){
                    data[j].children.push(data[i])
                    break;
                }
            }
        }
        return tree;//返回tree
    },

})