天天看点

hutool-树结构使用笔记文档地址构造树行结构前端展示

文档地址

hutool树形结构文档

构造树行结构

因为数据结构使用,所以要用到扩展字段,记录一下使用过程。

上代码:

@Override
    public List<Tree<String>> tree(SysMenu sysMenu) {
        //配置
        TreeNodeConfig treeNodeConfig = new TreeNodeConfig();
        // 自定义属性名 都要默认值的
        treeNodeConfig.setWeightKey("order");
        treeNodeConfig.setIdKey("rid");
        // 最大递归深度
        treeNodeConfig.setDeep(3);
        List<SysMenu> list = this.list();
        List<Tree<String>> treeNodes = TreeUtil.build(list, "0", treeNodeConfig,
                (treeNode, tree) -> {
                    tree.setId(treeNode.getMenuId());
                    tree.setParentId(treeNode.getParentId());
                    //tree.setWeight(treeNode.getWeight());
                    tree.setName(treeNode.getMenuName());
                    // 扩展属性 ...
                    tree.putExtra("route", treeNode.getRoute());
                    tree.putExtra("seq", treeNode.getSeq());
                    //tree.putExtra("other", new Object());
                });
        return treeNodes;
    }           

复制

前端展示

{
  "success": true,
  "code": 200,
  "message": "成功",
  "data": [
    {
      "rid": "1",
      "parentId": "0",
      "name": "1级菜单",
      "route": "1",
      "seq": 1,
      "children": [
        {
          "rid": "2",
          "parentId": "1",
          "name": "2级菜单",
          "route": "1",
          "seq": 2,
          "children": [
            {
              "rid": "3",
              "parentId": "2",
              "name": "3级菜单",
              "route": "1",
              "seq": 3,
              "children": null
            }
          ]
        }
      ]
    }
  ]           

复制

hutool-树结构使用笔记文档地址构造树行结构前端展示

树结构

顺利展示,记录下笔记!

腾云先锋(TDP,Tencent Cloud Developer Pioneer)是腾讯云GTS官方组建并运营的技术开发者群体。这里有最专业的开发者&客户,能与产品人员亲密接触,专有的问题&需求反馈渠道,有一群志同道合的兄弟姐妹。来加入属于我们开发者的社群吧 。