如何构造分层次的 Json 数据
十年河东，十年河西，莫欺骚年穷...打错个字~_~
现有如下需求，构造分层次的Json数据,层次结构类似下图：
上图使用EasyUI生成的，静态HTML如下：
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=GBK" /> <title>测试</title> <link href="/jquery-easyui-1.3.0/themes/default/easyui.css" rel="stylesheet" type="text/css" /> <link href="/jquery-easyui-1.3.0/themes/default/easyui.css" rel="stylesheet" /> <script src="/jquery-easyui-1.3.0/jquery-1.7.2.min.js" type="text/javascript"></script> <script src="/jquery-easyui-1.3.0/jquery.easyui.min.js" type="text/javascript"></script> <link href="/jquery-easyui-1.3.0/themes/icon.css" rel="stylesheet" type="text/css" /> <style type="text/css"> body { font: 12px/20px "微软雅黑", "宋体", Arial, sans-serif, Verdana, Tahoma; padding: 0; margin: 0; } a:link { text-decoration: none; } a:visited { text-decoration: none; } a:hover { text-decoration: underline; } a:active { text-decoration: none; } .cs-north { height: 60px; background: #B3DFDA; } .cs-north-bg { width: 100%; height: 100%; background: url(~/jquery-easyui-1.3.0/themes/gray/images/header_bg.png) repeat-x; } .cs-north-logo { height: 40px; padding: 15px 0px 0px 5px; color: #fff; font-size: 22px; font-weight: bold; text-decoration: none; } .cs-west { width: 200px; padding: 0px; border-left: 1px solid #99BBE8; } .cs-south { height: 25px; background: url('~/jquery-easyui-1.3.0/themes/gray/images/panel_title.gif') repeat-x; padding: 0px; text-align: center; } .cs-navi-tab { padding: 5px; } .cs-tab-menu { width: 120px; } .cs-home-remark { padding: 10px; } /*以下为自定义样式，用于表单验证*/ .warn { border-color: #f78d8d !important; outline: 0 !important; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgb(239, 154, 154) !important; box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(239, 154, 154) !important; } .error { color: red; font-size: small; } </style> <style type="text/css"> .tree li { margin-top: 4px; } </style> </head> <body> <ul class="easyui-tree" id="Ul1" style="padding-left: 5px;"> <li> <span>河南省</span> <ul> <li data-options="state:'open'"> <span>商丘市</span> <ul> <li data-options="state:'open'"> <span>永城市</span> <ul> <li> <span> <label>薛湖镇</label> </span> </li> <li> <span> <label>芒山镇</label> </span> </li> <li> <span> <label>陈集镇</label> </span> </li> </ul> </li> </ul> </li> <li data-options="state:'open'"> <span>洛阳市</span> <ul> <li data-options="state:'open'"> <span>伊川县</span> <ul> <li> <span> <label>太平镇</label> </span> </li> <li> <span> <label>大留镇</label> </span> </li> <li> <span> <label>小庙镇</label> </span> </li> </ul> </li> </ul> </li> </ul> </li> <li> <span>江苏省</span> <ul> <li data-options="state:'open'"> <span>苏州市</span> <ul> <li data-options="state:'open'"> <span>张家港市</span> <ul> <li> <span> <label>乐余镇</label> </span> </li> <li> <span> <label>锦丰镇</label> </span> </li> <li> <span> <label>兆丰镇</label> </span> </li> </ul> </li> </ul> </li> <li data-options="state:'open'"> <span>常熟市</span> <ul> <li data-options="state:'open'"> <span>长袖市</span> <ul> <li> <span> <label>平镇</label> </span> </li> <li> <span> <label>留镇</label> </span> </li> <li> <span> <label>庙镇</label> </span> </li> </ul> </li> </ul> </li> </ul> </li> </ul> </body> </html>
HTML代码仅供惨了，我们的重点的构造类似上图的JSON数据包。如何构造呢？
本篇利用LINQ结合数据库来构造这个JSON数据。
数据库部分如下：
create table HelloChina ( Id int identity(1,1) primary key, Province nvarchar(50),--省 City nvarchar(50),--市/区 District nvarchar(50),--县/区 OrgName nvarchar(50),--镇 AddTime datetime default(getdate()) ) insert into HelloChina(Province,City,District,OrgName) values('河南省','商丘市','永城市','薛湖镇') insert into HelloChina(Province,City,District,OrgName) values('河南省','商丘市','永城市','陈集镇') insert into HelloChina(Province,City,District,OrgName) values('河南省','商丘市','永城市','芒山镇') insert into HelloChina(Province,City,District,OrgName) values('河南省','洛阳市','伊川县','太平镇') insert into HelloChina(Province,City,District,OrgName) values('河南省','洛阳市','伊川县','大留镇') insert into HelloChina(Province,City,District,OrgName) values('河南省','洛阳市','伊川县','小庙镇') insert into HelloChina(Province,City,District,OrgName) values('河南省','平顶山市','鲁山县','炉山镇') insert into HelloChina(Province,City,District,OrgName) values('河南省','平顶山市','平川市','大茂镇') insert into HelloChina(Province,City,District,OrgName) values('江苏省','苏州市','张家港市','大学镇') insert into HelloChina(Province,City,District,OrgName) values('江苏省','苏州市','常熟市','小雪镇') insert into HelloChina(Province,City,District,OrgName) values('江苏省','南京市','南水市','高中镇') insert into HelloChina(Province,City,District,OrgName) values('江苏省','南京市','吴中市','初中镇') insert into HelloChina(Province,City,District,OrgName) values('安徽省','合肥市','肥水县','沸水镇') insert into HelloChina(Province,City,District,OrgName) values('安徽省','合肥市','肥水县','肥牛镇') insert into HelloChina(Province,City,District,OrgName) values('安徽省','南京市','京东县','羊羔镇') insert into HelloChina(Province,City,District,OrgName) values('山东省','临沂市','莒南县','老仆镇')
C#实体Model如下：
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Threading.Tasks; namespace AnBang.Model { public class BureauMenuModel_P { public string Province { get; set; } public List<BureauMenuModel_C> nodes { get; set; } } public class BureauMenuModel_C { public string City { get; set; } public List<BureauMenuModel_D> nodes { get; set; } } public class BureauMenuModel_D { public string District { get; set; } public List<BureauMenuModel_O> nodes { get; set; } } public class BureauMenuModel_O { public string OrgName { get; set; } } public class ResultModel { public List<BureauMenuModel_P> Json { get; set; } public string GroupName { get; set; } } public partial class HelloChinaModel { public int Id { get; set; } public string Province { get; set; } public string City { get; set; } public string District { get; set; } public string OrgName { get; set; } public Nullable<System.DateTime> AddTime { get; set; } } }
根据各个层次的划分，我们的各个 Model 之间也一定要存在这种层次关系！
下面就是具体的实现：
思路分析：依次分组划分，然后依次构造。
时间不多，不作讲解，代码如下：
public BaseResponse<ResultModel> GetJson() { using (AnbSosCustomerEntities context = new AnbSosCustomerEntities()) { BaseResponse<ResultModel> response = new BaseResponse<ResultModel>(); List<BureauMenuModel_P> MenuModelList = new List<BureauMenuModel_P>(); // List<HelloChinaModel> MList = new List<HelloChinaModel>(); var Hello = context.HelloChina; var Query = from Org in Hello select Org; if (Query.Count() > 0) { var data = Query.ToList(); MList = Mapper.DynamicMap<List<HelloChinaModel>>(data); } //根据省份 分组 var P_ls = MList.GroupBy(a => a.Province).Select(g => (new { Province = g.Key, Citys = g })).ToList(); foreach (var item in P_ls) { BureauMenuModel_P P = new BureauMenuModel_P(); P.Province = item.Province; P.nodes = new List<BureauMenuModel_C>(); var CityList = item.Citys.GroupBy(a => a.City).Select(g => new { City = g.Key, Districts = g }).ToList(); foreach (var CItem in CityList) { BureauMenuModel_C C = new BureauMenuModel_C(); C.City = CItem.City; C.nodes = new List<BureauMenuModel_D>(); var Districts = CItem.Districts.GroupBy(a => a.District).Select(g => new { District = g.Key, Orgs = g }).ToList(); foreach (var DistrictItem in Districts) { BureauMenuModel_D D = new BureauMenuModel_D(); D.nodes = new List<BureauMenuModel_O>(); D.District = DistrictItem.District; C.nodes = new List<BureauMenuModel_D>(); var orgs = DistrictItem.Orgs.ToList(); foreach (var org in orgs) { BureauMenuModel_O O = new BureauMenuModel_O(); O.OrgName = org.OrgName; D.nodes.Add(O); } C.nodes.Add(D); } P.nodes.Add(C); } MenuModelList.Add(P); } //string Json = JsonConvert.SerializeObject(MenuModelList); ; response.Data = new ResultModel(); response.Data.Json = MenuModelList; return response; } }
前端调用代码如下：
IBase Implement = new BaseImplement(); protected void Page_Load(object sender, EventArgs e) { List<BureauMenuModel_P> MenuModelList = new List<BureauMenuModel_P>(); if (Implement.GetJson().Data.Json != null) { MenuModelList = Implement.GetJson().Data.Json; } string Json = JsonConvert.SerializeObject(MenuModelList ); Response.Write(Json); }
得到的JSON数据如下：
[ { "Province": "河南省", "nodes": [ { "City": "商丘市", "nodes": [ { "District": "永城市", "nodes": [ { "OrgName": "薛湖镇" }, { "OrgName": "陈集镇" }, { "OrgName": "芒山镇" } ] } ] }, { "City": "洛阳市", "nodes": [ { "District": "伊川县", "nodes": [ { "OrgName": "太平镇" }, { "OrgName": "大留镇" }, { "OrgName": "小庙镇" } ] } ] }, { "City": "平顶山市", "nodes": [ { "District": "平川市", "nodes": [ { "OrgName": "大茂镇" } ] } ] } ] }, { "Province": "江苏省", "nodes": [ { "City": "苏州市", "nodes": [ { "District": "常熟市", "nodes": [ { "OrgName": "小雪镇" } ] } ] }, { "City": "南京市", "nodes": [ { "District": "吴中市", "nodes": [ { "OrgName": "初中镇" } ] } ] } ] }, { "Province": "安徽省", "nodes": [ { "City": "合肥市", "nodes": [ { "District": "肥水县", "nodes": [ { "OrgName": "沸水镇" }, { "OrgName": "肥牛镇" } ] } ] }, { "City": "南京市", "nodes": [ { "District": "京东县", "nodes": [ { "OrgName": "羊羔镇" } ] } ] } ] }, { "Province": "山东省", "nodes": [ { "City": "临沂市", "nodes": [ { "District": "莒南县", "nodes": [ { "OrgName": "老仆镇" } ] } ] } ] } ]
有人会问我，安徽省为什么有个南京市，我想说：数据库数据我是随便写的，不要介意哦！
@陈卧龙的博客
