最近花了不少時間在重構和進一步提煉我的Web開發架構上，力求在使用者體驗和界面設計方面，和Winform開發架構保持一緻，而在Web上，我主要采用EasyUI的前端界面處理技術，走MVC的技術路線，在重構完善過程中，很多細節花費不少時間進行研究和提煉，一步步走過來，也積累了不少經驗，本系列将主要介紹我在進一步完善我的Web架構基礎上積累的經驗進行分享，本随筆主要介紹使用如何使用Json實體類建構菜單資料，然後在主界面中進行使用。
菜單的界面效果如下所示，菜單分為一級菜單、二級菜單、三級菜單，他們各自在位置上是不同的定義，這個界面布局規定三級菜單就是最小的菜單節點了，也就是葉子節點。
要實作以上的菜單，需要把菜單定義成相關的Json資料，然後通過腳本把它們添加到界面裡面去，如下資料和腳本就是定義相關的菜單資料的。
從上面的菜單Json資料來看，它是一個字典的Json資料清單，在Web界面上，通過下面的代碼可以展開上面Json定義的二級菜單。
雖然上面的定義的資料能夠解決菜單的顯示問題，但是對于我們需要動态控制的菜單，顯然做不到，是以需要把上面的json資料，通過菜單控制器進行動态生成才可以，然後在腳本裡面通過Jquery的方式擷取Json資料，如下所示。
上面的GetMenuData方法，通過背景的控制器進行動态生成的，它的代碼如下所示
不過對于上面的代碼，我覺得雖然能解決問題，能夠正确生成相關的Json代碼，但是感覺不夠優雅，我不喜歡使用拼湊方法建構資料。
前面看了Menu的Json腳本，我說過他是一個字典類型的Json資料格式，那麼我們是否可以通過字典和實體資訊來承載，然後直接通過ToJson方法出來呢？答案是可以的。
上面的代碼，通過MenuData的對象資料，來承載相關的菜單資訊，然後把它添加到字典Dictionary<string, List<MenuData>> dict 裡面就可以了，這樣的代碼，沒有那麼多拼湊出來的感覺，是不是很好看呢？把對象轉換為Json資料，直接通過ToJson就可以解決了，很簡單吧。
而菜單的權限控制，就是通過集合權限管理進行判斷，父菜單如果沒有權限，就直接跳過，不在繼續生成下面的子菜單，權限判斷的如下所示。
當然，在界面上展開二級菜單的操作界面，也應該通過腳本動态進行生成的，這樣才能做到所有的内容動态建構。
上面使用ViewBag對象進行傳遞腳本内容到界面上，其實背景生成的操作，是一行HTML代碼就是了，代碼類似下面的内容。
最後出來的效果，就是部落格開始介紹的界面截圖，沒有任何變化，但是代碼我們已經經過了幾步的優化整理，看起來很清爽，更能實作動态變化了。
有空可以回顧下其他兩篇的經驗總結内容：
<a href="http://www.cnblogs.com/wuhuacong/p/3281103.html">基于MVC4+EasyUI的Web開發架構形成之旅--總體介紹</a>
<a href="http://www.cnblogs.com/wuhuacong/p/3317223.html">基于MVC4+EasyUI的Web開發架構形成之旅--界面控件的使用</a>
<a href="http://www.cnblogs.com/wuhuacong/p/3343967.html">基于MVC4+EasyUI的Web開發架構形成之旅--附件上傳元件uploadify的使用</a>
<a href="http://www.cnblogs.com/wuhuacong/p/3344096.html">基于MVC4+EasyUI的Web開發架構形成之旅--架構總體界面介紹</a>
<a href="http://www.cnblogs.com/wuhuacong/p/3352016.html">基于MVC4+EasyUI的Web開發架構形成之旅--基類控制器CRUD的操作</a>
<a href="http://www.cnblogs.com/wuhuacong/p/3361351.html">基于MVC4+EasyUI的Web開發架構形成之旅--權限控制</a>
<a href="http://www.cnblogs.com/wuhuacong/p/3667703.html">基于MVC4+EasyUI的Web開發架構經驗總結（1）-利用jQuery Tags Input 插件顯示選擇記錄</a>
<a href="http://www.cnblogs.com/wuhuacong/p/3669575.html">基于MVC4+EasyUI的Web開發架構經驗總結（2）- 使用EasyUI的樹控件建構Web界面</a>
<a href="http://www.cnblogs.com/wuhuacong/p/3669708.html">基于MVC4+EasyUI的Web開發架構經驗總結（3）- 使用Json實體類建構菜單資料</a>
<a href="http://www.cnblogs.com/wuhuacong/p/3736564.html">基于MVC4+EasyUI的Web開發架構經驗總結（4）--使用圖表控件Highcharts</a>
<a href="http://www.cnblogs.com/wuhuacong/p/3780356.html">基于MVC4+EasyUI的Web開發架構經驗總結（5）--使用HTML編輯控件CKEditor和CKFinder</a>
<a href="http://www.cnblogs.com/wuhuacong/p/3840321.html">基于MVC4+EasyUI的Web開發架構經驗總結（6）--在頁面中應用下拉清單的處理</a>
<a href="http://www.cnblogs.com/wuhuacong/p/3841338.html">基于MVC4+EasyUI的Web開發架構經驗總結（7）--實作省份、城市、行政區三者關聯</a>
<a href="http://www.cnblogs.com/wuhuacong/p/3871991.html">基于MVC4+EasyUI的Web開發架構經驗總結（8）--實作Office文檔的預覽</a>
<a href="http://www.cnblogs.com/wuhuacong/p/3872890.html">基于MVC4+EasyUI的Web開發架構經驗總結（9）--在Datagrid裡面實作外鍵字段的轉義操作</a>
<a href="http://www.cnblogs.com/wuhuacong/p/3873498.html">基于MVC4+EasyUI的Web開發架構經驗總結（10）--在Web界面上實作資料的導入和導出</a>
<a href="http://www.cnblogs.com/wuhuacong/p/4073203.html">基于MVC4+EasyUI的Web開發架構經驗總結（11）--使用Bundles處理簡化頁面代碼</a>
<a href="http://www.cnblogs.com/wuhuacong/p/4085682.html">基于MVC4+EasyUI的Web開發架構經驗總結（12）--利用Jquery處理資料互動的幾種方式</a>
<a href="http://www.cnblogs.com/wuhuacong/p/4085725.html">基于MVC4+EasyUI的Web開發架構經驗總結（13）--DataGrid控件實作自動适應寬帶高度</a>
<a href="http://www.cnblogs.com/wuhuacong/p/4093778.html">基于MVC4+EasyUI的Web開發架構經驗總結（14）--自動生成圖示樣式檔案和圖示的選擇操作</a>