easyui的tree（静态树/动态树）

最新推荐文章于 2020-06-22 02:43:15 发布

Orange_南橙

最新推荐文章于 2020-06-22 02:43:15 发布

阅读量3.8k

点赞数 1

CC 4.0 BY-SA版权

分类专栏：笔记文章标签： easyui

本文链接：https://blog.csdn.net/qq_45547474/article/details/106891993

本文介绍了EasyUI的tree组件，详细阐述了tree的作用和类型，包括同步加载和异步加载。通过创建数据库表、编写实体类、TreeBean类以及Controller和服务层代码，展示了静态树和动态树的实现过程。最后，展示了静态树和动态树的显示效果，并对可能出现的问题进行了总结。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、tree简介

今天来了解easyui的tree，顾名思义就是树形菜单。
例图就像是这样的：
在这里插入图片描述
tree它的作用就是：获取数据库表的数据，以树结构的形式展示出来。
树结构数据：分为同步加载和异步加载。

同步加载就是初始化加载时直接将整个树结构数据全部加载出来。
异步加载则是初始化加载时只加载树的根节点，当点击某个节点时才向系统请求数据，若该节点有子节点则加载（只加载）出该节点的子节点（子节点的子节点不加载）。

二、tree组件工具类的实现思路

然后在开始tree的学习之前，我们先来了解一下tree组件工具类的实现思路：
在这里插入图片描述
如果看图了解的不是很详细的话，那我们可以通过代码来学习。

三、tree组件工具类的使用

其实一般我是会使用MySQL去讲解的，但是为了让更多阶段的人了解到这个，所以我们就使用SQL Server数据库去录入数据。然后代码方面我们使用eclipse写，那么开始吧。

1、创建数据库表

这个我就不细讲了，直接放图例，看表结构跟表数据就可以了。
这里我是写的一个班级表：
在这里插入图片描述

2、实体类

通过mybatis逆向工程映射TreeTestTable：

//zouyan   当然如果类名那些过长，可以自己看情况改成自己比较容易理解的。
package com.zouyanbean;

public class TreeTestTable {
   
	private Integer id;
    private Integer pid;
    private String value;
    
    //set/get方法   调用方法后面就不会再讲了
    public Integer getId() {
   
		return id;
	}
	public void setId(Integer id) {
   
		this.id = id;
	}
	public Integer getPid() {
   
		return pid;
	}
	public void setPid(Integer pid) {
   
		this.pid = pid;
	}
	public String getValue() {
   
		return value;
	}
	public void setValue(String value) {
   
		this.value = value;
	}
	
	//构造方法
	public TreeTestTable() {
   }
	public TreeTestTable(Integer id, Integer pid, String value) {
   
		this.id = id;
		this.pid = pid;
		this.value = value;
	}
}

3、编写TreeBean类

由于实际使用中表结构不同，因此需要编写一个类用于将获取到的数据对象转为前端Tree能够读取并加载的数据格式：

//zouyan    当然如果类名那些过长，可以自己看情况改成自己比较容易理解的。
package com.zouyanpojo;

import java.util.ArrayList;
import java.util.List;
import com.zouyanbean.TreeTestTable;

public class TreeBean {
   
    private int id;
    private int pid;
    private String state;
    private String text;
    private List<TreeBean> children;
    
    /**
     * TreeTestTable对象转TreeBean对象
     * @param treeList
     * @return
     */
    public static List<TreeBean> toTreeBeans(List<TreeTestTable> treeList){
   
        List<TreeBean> treeBeans = new ArrayList<TreeBean>();
        for (TreeTestTable tree