tree的后端实现

知识总结


目录

知识总结

学习目标:

将原有的死数据替换成数据库中读取的方式(参考上节tree前端实现:tree的前端实现)

一、Jackson转换json串

1.转换对应的数据格式

思考:我想拿到如下json串需要如何取获取

 解决:

 分析:

2.转换成对应的数据格式

思考:

分析:

 结论:

二、easyui树形组数据结构的生成

使用t_easyui_menu表:

 建立menu实体类对象:

建立MenuDao(exdends extends BaseDao

)

   缺陷:

 思考:  

 创建TreeVo对象

 BuidTree工具类

 优化后的MenuDao的tree方法

 构建父子层级关系:

三、把数据绑到界面上去 (修改原来的前端实现的js)


学习目标:

将原有的死数据替换成数据库中读取的方式(参考上节tree前端实现:tree的前端实现


一、Jackson转换json串

1.转换对应的数据格式

浏览的需要使用的jar包

思考我想拿到如下json串需要如何取获取

 解决:

方法一:可以建立一个对象JsonObject转换成json串--》json对象

 分析:

属性有id,text,state

 代码如下:

package com.xhy.demo;

import com.fasterxml.jackson.core.JsonProcessingException;

import com.fasterxml.jackson.databind.ObjectMapper;

public class JsonDemo {

public static void main(String[] args) throws Exception {

//实体类对象转换成json串--》json对象方式一

JsonObject obj1=new JsonObject("1","学生管理","closed");

ObjectMapper om=new ObjectMapper();

System.out.println(om.writeValueAsString(obj1));

}

}

运行结果:

 方法二:建立map集合转换成json串--》json对象

 代码如下:

Map<String, Object> map=new HashMap<String, Object>();

map.put("id", "1");

map.put("text","学生管理");

map.put("state", "closed");

System.out.println(om.writeValueAsString(map));

运行结果与建立对象一样:

2.转换成对应的数据格式

思考:

首先前面获取到了jackson串的数据,对应的格式还没获取到,那么怎么获取到它对应的数据格式

分析:

在jsonobject中要有一个数组格式

把对象或者map集合放入到list集合数组中

代码:

package com.xhy.demo;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import com.fasterxml.jackson.databind.ObjectMapper;

public class JsonDemo2 {
public static void main(String[] args) throws Exception{
    JsonObject obj1=new JsonObject("1","学生管理",null);
    JsonObject obj2=new JsonObject("2","学生管理","closed");
List<JsonObject>list=new ArrayList<JsonObject>();
list.add(obj1);
list.add(obj2);
    ObjectMapper om=new ObjectMapper();
System.out.println(om.writeValueAsString(list));

Map<String, Object> map=new HashMap<String, Object>();
map.put("id", "1");
map.put("text","学生管理");
map.put("state", "closed");
Map<String, Object> map2=new HashMap<String, Object>();
map.put("id", "2");
map2.put("text","学生管理");
map2.put("state", "null");
List<Map<String, Object>>listMap=new ArrayList<>();
listMap.add(map);
listMap.add(map2);
System.out.println(om.writeValueAsString(listMap));

}
}

 

 运行结果: 

 结论:

就json串的转换结果而言,Map等价于对象,List<Map>等价于List<创建的类>


二、easyui树形组数据结构的生成

结合自定义mvc框架(导成jar包):

mvc框架https://blog.csdn.net/qq_54936371/article/details/120008714?spm=1001.2014.3001.5501https://blog.csdn.net/qq_54936371/article/details/120008714?spm=1001.2014.3001.5501

导入对应的lib包

 Tag---》分页要用到的

Util---》工具包

 和配置文件mvc2.xml(根目录下)

Web.xml

Zking.tld

使用t_easyui_menu表:

 建立menu实体类对象:

package com.xhy.entity;

public class Menu {
private String serialNo;
private String menuid;
private String menuname;
private String menuURL;
private String parentid;
public String getSerialNo() {
    return serialNo;
}
public void setSerialNo(String serialNo) {
    this.serialNo = serialNo;
}
public String getMenuid() {
    return menuid;
}
public void setMenuid(String menuid) {
    this.menuid = menuid;
}
public String getMenuname() {
    return menuname;
}
public void setMenuname(String menuname) {
    this.menuname = menuname;
}
public String getMenuURL() {
    return menuURL;
}
public void setMenuURL(String menuURL) {
    this.menuURL = menuURL;
}
public String getParentid() {
    return parentid;
}
public void setParentid(String parentid) {
    this.parentid = parentid;
}
public Menu(String serialNo, String menuid, String menuname, String menuURL, String parentid) {
    super();
    this.serialNo = serialNo;
    this.menuid = menuid;
    this.menuname = menuname;
    this.menuURL = menuURL;
    this.parentid = parentid;
}

@Override
public String toString() {
    return "Menu [serialNo=" + serialNo + ", menuid=" + menuid + ", menuname=" + menuname + ", menuURL=" + menuURL
            + ", parentid=" + parentid + "]";
}
public Menu() {
    // TODO Auto-generated constructor stub
}
}
 

建立MenuDao(exdends extends BaseDao<Menu>)

package com.zking.dao;

import java.util.List;

import com.fasterxml.jackson.databind.ObjectMapper;
import com.xhy.entity.Menu;
import com.zking.util.BaseDao;
import com.zking.util.PageBean;

public class MenuDao extends BaseDao<Menu>{
    
public List<Menu>list(Menu menu,PageBean pageBean) throws Exception{
    return super.executeQuery("select * from t_easyui_menu", Menu.class, pageBean);
    
}
public static void main(String[] args) throws Exception {
    MenuDao menuDao=new MenuDao();
    List<Menu>list=menuDao.list(null, null);
    ObjectMapper om=new ObjectMapper();
  
    System.out.println(om.writeValueAsString(list));
}
}
 

运行结果

   
缺陷:

1.json串并没有体现出父子层级关系,数据之间都是平级的
2.json串属性是定死的

 思考:  

1. TreeVo<T>对象--》存储json文件的属性

通过api手册可知--》在json文件只能识别以下属性:

  • id:节点ID,对加载远程数据很重要。

  • text:显示节点文本。

  • state:节点状态,'open' 或 'closed',默认:'open'。如果为'closed'的时候,将不自动展开该节点。

  • checked:表示该节点是否被选中。

  • attributes: 被添加到节点的自定义属性。

  • children: 一个节点数组声明了若干节点。

2.List<Menu>--->List<TreeVo<Menu>>

TreeVo vo=new TreeVo();

vo.setId(menu.getId());

...

3.让List<TreeVo<Menu>>中的数据有父子层级关系

for(){

外层

权限管理

for(){

内层

}

}

 4.外层循环节点id如果等于内层循环节点的父id,那么就意味着内层循环当前的循环的节点是外层循环节点的儿子,那么此时就可以将内层循环的节点放入外层循环节点的children属性中

 创建TreeVo<T>对象

package com.zking.util;

import java.util.ArrayList;
import java.util.List;
import java.util.Map;


public class TreeVo<T> {
    /**
     * 节点ID
     */
    private String id;
    /**
     * 显示节点文本
     */
    private String text;
    /**
     * 节点状态,open closed
     */
    private Map<String, Object> state;
    /**
     * 节点是否被选中 true false
     */
    private boolean checked = false;
    /**
     * 节点属性
     */
    private Map<String, Object> attributes;

    /**
     * 节点的子节点
     */
    private List<TreeVo<T>> children = new ArrayList<TreeVo<T>>();

    /**
     * 父ID
     */
    private String parentId;
    /**
     * 是否有父节点
     */
    private boolean hasParent = false;
    /**
     * 是否有子节点
     */
    private boolean hasChildren = false;

    public String getId() {
        return id;
    }

    public void setId(String id) {
        this.id = id;
    }

    public String getText() {
        return text;
    }

    public void setText(String text) {
        this.text = text;
    }

    public Map<String, Object> getState() {
        return state;
    }

    public void setState(Map<String, Object> state) {
        this.state = state;
    }

    public boolean isChecked() {
        return checked;
    }

    public void setChecked(boolean checked) {
        this.checked = checked;
    }

    public Map<String, Object> getAttributes() {
        return attributes;
    }

    public void setAttributes(Map<String, Object> attributes) {
        this.attributes = attributes;
    }

    public List<TreeVo<T>> getChildren() {
        return children;
    }

    public void setChildren(List<TreeVo<T>> children) {
        this.children = children;
    }

    public boolean isHasParent() {
        return hasParent;
    }

    public void setHasParent(boolean isParent) {
        this.hasParent = isParent;
    }

    public boolean isHasChildren() {
        return hasChildren;
    }

    public void setChildren(boolean isChildren) {
        this.hasChildren = isChildren;
    }

    public String getParentId() {
        return parentId;
    }

    public void setParentId(String parentId) {
        this.parentId = parentId;
    }

    public TreeVo(String id, String text, Map<String, Object> state, boolean checked, Map<String, Object> attributes,
                  List<TreeVo<T>> children, boolean isParent, boolean isChildren, String parentID) {
        super();
        this.id = id;
        this.text = text;
        this.state = state;
        this.checked = checked;
        this.attributes = attributes;
        this.children = children;
        this.hasParent = isParent;
        this.hasChildren = isChildren;
        this.parentId = parentID;
    }

    public TreeVo() {
        super();
    }

}

 BuidTree工具类

 package com.zking.util;


import com.zking.util.TreeVo;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

public class BuildTree {

    /**
     * 默认-1为顶级节点
     * @param nodes
     * @param <T>
     * @return
     */
    public static <T> TreeVo<T> build(List<TreeVo<T>> nodes) {

        if (nodes == null) {
            return null;
        }
        List<TreeVo<T>> topNodes = new ArrayList<TreeVo<T>>();

        for (TreeVo<T> children : nodes) {
            String pid = children.getParentId();
            if (pid == null || "-1".equals(pid)) {
                topNodes.add(children);

                continue;
            }

            for (TreeVo<T> parent : nodes) {
                String id = parent.getId();
                if (id != null && id.equals(pid)) {
                    parent.getChildren().add(children);
                    children.setHasParent(true);
                    parent.setChildren(true);
                    continue;
                }
            }

        }

        TreeVo<T> root = new TreeVo<T>();
        if (topNodes.size() == 1) {
            root = topNodes.get(0);
        } else {
            root.setId("000");
            root.setParentId("-1");
            root.setHasParent(false);
            root.setChildren(true);
            root.setChecked(true);
            root.setChildren(topNodes);
            root.setText("顶级节点");
            Map<String, Object> state = new HashMap<>(16);
            state.put("opened", true);
            root.setState(state);
        }

        return root;
    }

    /**
     * 指定idparam为顶级节点
     * @param nodes
     * @param idParam
     * @param <T>
     * @return
     */
    public static <T> List<TreeVo<T>> buildList(List<TreeVo<T>> nodes, String idParam) {
        if (nodes == null) {
            return null;
        }
        List<TreeVo<T>> topNodes = new ArrayList<TreeVo<T>>();

        for (TreeVo<T> children : nodes) {

            String pid = children.getParentId();
            if (pid == null || idParam.equals(pid)) {
                topNodes.add(children);

                continue;
            }

            for (TreeVo<T> parent : nodes) {
                String id = parent.getId();
                if (id != null && id.equals(pid)) {
                    parent.getChildren().add(children);
                    children.setHasParent(true);
                    parent.setChildren(true);

                    continue;
                }
            }

        }
        return topNodes;
    }

}

 优化后的MenuDao的tree方法

public List<TreeVo<Menu>> tree(Menu menu,PageBean pageBean) throws Exception{
//拿到平级数据list方法
    List<Menu>list=this.list(menu, pageBean);
    //建立一个装list数据的数组
    List<TreeVo<Menu>> listvos=new ArrayList<TreeVo<Menu>>();
    //遍历list数据
    for (Menu m : list) {
        TreeVo<Menu>vo=new TreeVo<>();
        vo.setId(m.getMenuid());
        vo.setText(m.getMenuname());
        vo.setParentId(m.getParentid());
    Map<String, Object> attributes=new HashMap<String, Object>();
    attributes.put("self", m);//selef随便取一个名字
    
    vo.setAttributes(attributes);
    listvos.add(vo);
    }
    return     listvos;
}

测试:

public static void main(String[] args) throws Exception {
    MenuDao menuDao=new MenuDao();
    List<TreeVo<Menu>> tree=menuDao.tree(null, null);
    ObjectMapper om=new ObjectMapper();
    System.out.println(om.writeValueAsString(tree));

}

 运行结果(ListVo--》List<Tree<<Menu>>>):

 构建父子层级关系:

 就需要tree方法返回用到Buildtree工具类

    return  BuildTree.buildList(listvos,"000");

 运行结果(得到了父子层级关系): 


三、把数据绑到界面上去 (修改原来的前端实现的js)

index.js(注意:js文件中是不支持EL表达式的

在此url传一个全路径,需要在主页写一个公共的参数

<input type="hidden" id="ctx" value="${ pageContext.request.contextPath }">

$(function() {
    $('#tt1').tree({    
        url:$("#ctx").val()+ '/menu.action?methodName=tree',
            onClick: function(node){
            //    alert(node.text);  // 在用户点击的时候提示
                var exists = $('#tt2').tabs('exists',node.text);//不存在
                if(exists){
                    $('#tt2').tabs('select',node.text);//默认选中
                }else{
                    //添加新的tab页
                    $('#tt2').tabs('add',{    
                        title:node.text,    
                        content:'<iframe width=100% height=100% src="'+ node.attributes.url+'"></iframe>',
                        closable:true,    
                        tools:[{    
                            iconCls:'icon-mini-refresh',    
                            handler:function(){    
                                alert('refresh');    
                            }    
                        }]    
                    });  
                }
            }
    }); 
})

 下一步,开发子控制器MenuAction

MenuAction(因为在这个项目里面实现的都是ajax(无刷新),所以不需要返回值)

package com.zking.web;
 
import java.util.List;
 
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
 
import com.zking.dao.MenuDao;
import com.zking.entity.Menu;
import com.zking.framework.ActionSupport;
import com.zking.framework.ModelDriver;
import com.zking.util.ResponseUtil;
import com.zking.util.TreeVo;
 
public class MenuAction extends ActionSupport implements ModelDriver<Menu>{
 
    private Menu menu = new Menu();
    
    private MenuDao menuDao = new MenuDao();
    
    public Menu getModel() {
        return menu;
    }
 
    public String tree(HttpServletRequest peq,HttpServletResponse resp) throws Exception {
        List<TreeVo<Menu>> tree = menuDao.tree(null, null);
        ResponseUtil.writeJson(resp, tree);
        return null;
    }
    

 在我们写方法是经常会写类似代码,这时我们需要这个工具类ResponseUtil,来简化代码

ResponseUtil

 package com.zking.util;
 
import java.io.PrintWriter;
 
import javax.servlet.http.HttpServletResponse;
 
import com.fasterxml.jackson.databind.ObjectMapper;
 
public class ResponseUtil {
 
    public static void write(HttpServletResponse response,Object o)throws Exception{
        response.setContentType("text/html;charset=utf-8");
        PrintWriter out=response.getWriter();
        out.println(o.toString());
        out.flush();
        out.close();
    }
    
    public static void writeJson(HttpServletResponse response,Object o)throws Exception{
        ObjectMapper om = new ObjectMapper();
        write(response, om.writeValueAsString(o));
    }
    
}

 下一步,配置xml文件

mvc2.xml

<?xml version="1.0" encoding="UTF-8"?>
<config>
    <action path="/menu" type="com.zking.web.MenuAction">
        
    </action>
</config>

运行结果:

 午安🙃

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值