您的位置:首页 > Web前端 > JavaScript

树形菜单的json字符串的拼接

2016-09-23 16:23 513 查看
最近在学习权限管理, 要用到树形按钮, 但是字符串的拼接是一个难理解的问题, 然后从网上找了一个从前台用js来遍历组成这个json字符串, 很好! 但是没看懂...

var data = [
{"id":1,"parendId":0,"name":"Foods"},
{"id":2,"parentId":1,"name":"Fruits"},
{"id":3,"parentId":1,"name":"Vegetables"},
{"id":4,"parentId":2,"name":"apple"},
{"id":5,"parentId":2,"name":"orange"},
{"id":6,"parentId":3,"name":"tomato"},
{"id":7,"parentId":3,"name":"carrot"},
{"id":8,"parentId":3,"name":"cabbage"},
{"id":9,"parentId":3,"name":"potato"},
{"id":10,"parentId":3,"name":"lettuce"}
];

function exists(rows, parentId){
for(var i=0; i<rows.length; i++){
if (rows[i].id == parentId) {
return true;
}
}
return false;
}

function convert(rows){
var nodes = [];
//取到第一级菜单
for(var i=0; i<rows.length; i++){
var row = rows[i];
if (!exists(rows, row.parentId)){
nodes.push({
id:row.id,
text:row.name
});
}
}

var toDo = [];
for(var i=0; i<nodes.length; i++){
toDo.push(nodes[i]);
}
while(toDo.length){
var node = toDo.shift();    // the parent node
//取得子菜单
for(var i=0; i<rows.length; i++){
var row = rows[i];
if (row.parentId == node.id){
var child = {id:row.id,text:row.name};
if (node.children){
node.children.push(child);
} else {
node.children = [child];
}
toDo.push(child);
}
}
}
return nodes;
}

var data1 = convert(data);

$('#tt').tree({
data:data1
});


下面是从后台拼接字符串

贴在这里从后台实现的方法不是一种可取的办法, 是利用多次从数据库取出数据进行拼接, 最后也能实现效果, 只是这个数据量太小了, 如果是企业里比较大型的项目, 这样会占用不少电脑的性能, 从网上找的那些基本没看懂

import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.Statement;
import java.util.ArrayList;
import java.sql.Connection;

/**
* @author 25673
* @数据库连接类
*/
public class ConnectionUtil {
public static Connection getConnection() {
Connection conn = null;
try {
Class.forName("com.mysql.jdbc.Driver");
//"jdbc:mysql://数据库地址:3306/数据库名","用户名","用户密码"
conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/quanxian","root","");
} catch (Exception e) {
e.printStackTrace();
}
return conn;
}

public static ArrayList<Menu> findMenu(String parentid) {
String sql = "select * from sys_menu where parent_id = '"+parentid+"'";
Connection c = null;
Statement s = null;
ResultSet r = null;
ArrayList<Menu> arrList = null;

c = getConnection();
try {
s = c.createStatement();
r = s.executeQuery(sql);
arrList = new ArrayList<Menu>();
while(r.next()) {
Menu menu = new Menu();
menu.setId(r.getString("id"));
menu.setParentid(r.getString("parent_id"));
menu.setMenuName(r.getString("menu_name"));
arrList.add(menu);
}

} catch (Exception e) {
e.printStackTrace();
} finally {
try {
c.close();
s.close();
r.close();
} catch (Exception e) {
e.printStackTrace();
}
}
return arrList;
}

/**
* @param arrList 查询出来的所有符合条件的结果
* @param parentid 第一级菜单的parentid
* @return
*/
public static String strJson(String parentid) {
/*
每调用一次这个方法, 就要去连接一次数据库, 总觉这样会增加很多工作量, 因为是进行了多次查询
这里使用了递归的方式
*/
ArrayList<Menu> arrList = findMenu(parentid);
StringBuilder sb = new StringBuilder();
for(int n = 0;n < arrList.size();n++) {
sb.append("{");
sb.append("\"id\":\""+arrList.get(n).getId()+"\",");
sb.append("\"text\":\""+arrList.get(n).getMenuName()+"\"");
String str = strJson(arrList.get(n).getId());
if(!str.equals("")) {
sb.append(",\"state\":\"closed\"");
sb.append(",\"children\":["+str+"]");
}
sb.append("}");
if(n < (arrList.size() - 1)) {
sb.append(",");
}
}
return sb.toString();
}
}


还在继续思考怎么从后台一次性查出所有的信息, 直接用拼接的方式组成这个字符串, 希望能有人指点一下, 谢谢
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: