Bootstrap Treeview 将資料按照父子順序生成樹

Bootstrap Treeview 将父子結構資料按照順序生成樹

• 前言
• • 組織方式

前言

因為項目的機會,使用到了Bootstrap Treeview的JavaScript元件.但是他要求的資料格式并不是簡單的key/value形式.是以存在資料組織的問題,要麼通過後端根據資料庫查詢出的資料進行重組,要麼在前端對資料庫傳回資料進行重組.。

組織方式

對現在有效簡單的資料組織方式做一次分享：

1. 後端重組 (随後回貼出Java代碼示例)；
2. SQL查詢父子結構 部落格裡有文章寫到了

PostgreSQL 将父子表按照父子結構排序

1. 前端重組 :

function getTreeData(list) {
	var item,result = [];
	//周遊根節點，遞歸處理其所有子節點的資料
	//每處理完一個根節點，就将其及其所有子節點從list中删除，加快遞歸速度
	while (list.length) {
		item = list[0];
		list.splice(0, 1);
		delete item.yhlxpid;
		getAllNodes(list, item);
		item.text = item.yhlxtitle;
		result.push(item);
	}
	return result;
}

function getAllNodes(list, item) {
	var nodes = getNextLevelNodes(list, item);
	for (var i = 0, ii = nodes.length; i < ii; i++) {
		getAllNodes(list, nodes[i]);
	}
}

function getNextLevelNodes(list, item) {
	var nodes = [];
	for (var i = 0; i < list.length; i++) {
		var mid = list[i];
		if (mid.yhlxpid === item.yhlxid) {
			delete mid.yhlxpid;
			mid.text = mid.yhlxtitle;
			nodes.push(mid);
			list.splice(i, 1);
			i--;
		}
	}
	if (nodes.length > 0) {
		item.nodes = nodes;
	}
	return nodes;
}