Question

如何将数据库中存的树转化为树形列表(以easyui的tree为例)

Answer 1

很多时候，我们会把一棵树存放到数据库中，当前台需要展示一个树形列表时，将这棵树读取出来并显示，这个过程是怎么实现的呢？

这篇文章是以构造一棵easyui前台框架的一个树形列表为例，后台框架是spring MVC+JPA。

首先看一下数据库中这颗树是怎么存的：





树的结构一目了然，这是一棵表示部门的树。

下面是实体类：

/**
* 部门类 用户所属部门（这里的部门是一个相对抽象的词）
* 使用前缀编码，每级增加三个数字，如：第一级 001，第二级001001，第三级001001001
* @author Administrator
*
*/
@Entity
public class Department {

private String id; //部门id
private String pid; //父id
private String text; //部门名称
private List<Department> children; //用于存储子节点
@Id
public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}
public String getPid() {
return pid;
}
public void setPid(String pid) {
this.pid = pid;
}

public String getText() {
return text;
}
public void setText(String text) {
this.text = text;
}
@OneToMany
public List<Department> getChildren() {
return children;
}
public void setChildren(List<Department> children) {
this.children = children;
}

}由于使用的是easyui ，为了树可以正确显示，必须包含属性id和text。

下面是控制类，用于读取数据库中的数据，生成一个List,该list返回到前台时会转成json格式的数据，重点需要理解的就是getTree()和buildTree()这两个方法，通过递归生成这棵树，基本实现原理是遍历树的某一层，获取每个节点的子节点们（一个list）,然后将它作为父节点的一个属性set进去

@Controller
@RequestMapping("/department")
public class DepartmentController {
private static final String DEPARTEMNTMANAGE = "module/jsp/system/departmentManage.jsp";

@Resource(name="departmentServiceImpl")
private DepartmentService departmentService;
/**
* 获取部门管理页面.
* @return
*/
@RequestMapping("/getPage.do")
public String getUserManagePage(){
return DEPARTEMNTMANAGE;
}

/**
* 获取部门树形列表
*/
@RequestMapping(value = "/getTree.do", method = RequestMethod.POST)
@ResponseBody //此注解表明返回值跳过视图处理部分，直接写入 http response body中
public List<Department> getTree(){
List<Department> root = departmentService.findById("0"); //获取根节点（获取的值存到list中）
net.sf.json.JSONArray jsonArray = net.sf.json.JSONArray.fromObject(buildTree(root));
System.out.println(jsonArray.toString());
return buildTree(root);
}
public List<Department> buildTree(List<Department> root){
for(int i=0;i<root.size();i++){
List<Department> children = departmentService.findByPid(root.get(i).getId()); //查询某节点的子节点（获取的是list）
buildTree(children);
root.get(i).setChildren(children);
}
return root;
}

}这里用查询的方法findById和findByPid是基于spring data JPA的方法，下面是相关类：

public interface DepartmentDao extends Repository<Department, Integer>{
public List<Department> findByPid(String pid);
public List<Department> findById(String id);
}


public interface DepartmentService {
public List<Department> findByPid(String pid);
public List<Department> findById(String id);
}

@Service("departmentServiceImpl")
public class DepartmentServiceImpl implements DepartmentService{
@Autowired
private DepartmentDao departmentDao;

@Override
public List<Department> findByPid(String pid) {
return departmentDao.findByPid(pid);
}
@Override
public List<Department> findById(String id) {
return departmentDao.findById(id);
}
}

前台调用如下：

$(function(){
$('#tt').tree({
url: 'department/getTree.do',
loadFilter: function(data){
if (data.d){
return data.d;
} else {
return data;
}
}
});
});这是后台返回给前台一个如下的json格式的数据：

[
{
"children": [
{
"children": [
{
"children": [],
"id": "001001",
"pid": "001",
"text": "部门一"
},
{
"children": [],
"id": "001002",
"pid": "001",
"text": "部门二"
}
],
"id": "001",
"pid": "0",
"text": "一分公司"
},
{
"children": [
{
"children": [],
"id": "002001",
"pid": "002",
"text": "部门一"
},
{
"children": [],
"id": "002002",
"pid": "002",
"text": "部门二"
}
],
"id": "002",
"pid": "0",
"text": "二分公司"
},
{
"children": [],
"id": "003",
"pid": "0",
"text": "三分公司"
}
],
"id": "0",
"pid": "-1",
"text": "总公司"
}
]

在页面上如下显示：



大致就是这样实现的，如果觉得小编写的不明白可以加Q探讨或在下边回复




如何将数据库中存的树转化为树形列表(以easyui的tree为例)
标签：