MVC實(shí)例入門經(jīng)典推薦

1、初次學(xué)習(xí)A MVC，因此簡單的記錄一下自己的學(xué)習(xí)過程和經(jīng)歷，以便后面學(xué)習(xí)參考，同時也為后來者做出自己的一點(diǎn)點(diǎn)貢獻(xiàn)。第一步：創(chuàng)建一個新的MVC4項(xiàng)目。打開VS2012，在“文件”菜單下選擇“新建”下拉菜單下的“項(xiàng)目”，在彈出的“新建項(xiàng)目”對話框中選擇Web選項(xiàng)卡，選擇ASP.NET MVC 4 Web 應(yīng)用程序，在名稱里輸入：MyFirstMvcApplication，點(diǎn)擊確定，即完成項(xiàng)目的新建。在稍后彈出的“選擇模板”中選擇【基本】，然后點(diǎn)擊確定，即完成一個MVC項(xiàng)目的創(chuàng)建。如下圖所示：默認(rèn)情況下的項(xiàng)目結(jié)構(gòu)如圖所示：創(chuàng)建完成后，我們可以發(fā)現(xiàn)，新建項(xiàng)目的同時創(chuàng)建了一個與之同名的解決方案。MVC默

2、認(rèn)情況下，在新建項(xiàng)目的同時創(chuàng)建一個解決方案。開發(fā)者可以在解決方案中任意添加項(xiàng)目。新建完成時，我們可以看到Controllers文件夾、Models文件夾下都是空的，什么也沒有；Views文件夾下默認(rèn)有個Shared文件夾。MVC文件夾介紹可以參看ASP.NET MVC 經(jīng)典入門教程(推薦閱讀)。備注：所有 MVC 應(yīng)用程序中的文件夾名稱都是相等的。MVC 框架基于默認(rèn)的命名。控制器位于 Controllers 文件夾，視圖位于 Views 文件夾，模型位于 Models 文件夾。您不必在應(yīng)用程序代碼中使用文件夾名稱。標(biāo)準(zhǔn)化的命名減少了代碼量，同時有利于開發(fā)者對 MVC 項(xiàng)目的理解。下面是對每個

3、文件夾內(nèi)容的簡要描述：1.App_Data 文件夾App_Data 文件夾用于存儲應(yīng)用程序數(shù)據(jù)。我們將在本教程稍后的章節(jié)向 App_Data 文件夾添加 SQL 數(shù)據(jù)庫。2.Content 文件夾Content 文件夾用于靜態(tài)文件，比如樣式表（CSS 文件）、圖表和圖像。Visual Web Developer 會自動向 Content 文件夾添加一個 themes 文件夾。這個 themes 文件夾存放 jQuery 樣式和圖片。在這個項(xiàng)目中，您可以刪除這個主題文件夾。Visual Web Developer 同時向項(xiàng)目添加標(biāo)準(zhǔn)的樣式表文件：Content 文件夾中的文件

4、。這個樣式表文件是您希望改變應(yīng)用程序樣式時需要編輯的文件。我們將在本教程的下一章中編輯這個樣式表文件 (Site.css)。3.Controllers 文件夾Controllers 文件夾包含負(fù)責(zé)處理用戶輸入和響應(yīng)的控制器類。MVC 要求所有控制器文件的名稱以 "Controller" 結(jié)尾。Visual Web Developer 已創(chuàng)建好一個 Home 控制器（用于首頁和關(guān)于頁面）以及一個 Account 控制器（用于登錄頁面）：我們將在本教程稍后的章節(jié)創(chuàng)建更多控制器。4.Models 文件夾Models 文件夾包含表示應(yīng)用程序模型的類。模型存有并操作應(yīng)用程序的數(shù)據(jù)。我

5、們將在本教程稍后的章節(jié)創(chuàng)建模型（類）。5.Views 文件夾Views 文件夾存有與應(yīng)用程序的顯示相關(guān)的 HTML 文件（用戶界面）。Views 文件夾中含有每個控制器對于的一個文件夾。Visual Web Developer 已創(chuàng)建了一個 Account 文件夾、一個 Home 文件夾、一個 Shared 文件夾（在 Views 文件夾內(nèi)）。Account 文件夾包含用于注冊并登錄用戶帳戶的頁面。Home 文件夾用于存儲諸如首頁和關(guān)于頁之類的應(yīng)用程序頁面。Shared 文件夾用于存儲控制器間分享的視圖（模板頁和布局頁）。6.Scripts 文件夾Scripts 文件夾存儲應(yīng)用程序的 Java

6、Script 文件。默認(rèn)地，Visual Web Developer 在這個文件夾中放置標(biāo)準(zhǔn)的 MVC、Ajax 以及 jQuery 文件：注釋：文件 "modernizr" 是用于在應(yīng)用程序中支持 HTML5 和 CSS3 的 JavaScript 文件。第二步：在Models文件夾下添加類。操作如圖所示：Model文件夾下有一個c#文件，在其中添加代碼如下：using System;using System.Collections.Generic;using System.Linq;using System.Web;/這里的namespace名與所創(chuàng)建的項(xiàng)目程序名相同

7、/創(chuàng)建一個Person類 public class Person private string addr;/聲明一個字符串類型的addr字段 public string Name/聲明一個Name屬性 get; set; public string Address;/聲明一個Address屬性 get return this.addr; set this.addr = value; 第三步：在Controllers文件夾下添加Controller。Controllers文件夾下有一個c#Test文件，在其中添加代碼如下：using System;using System.Collections

8、.Generic;using System.Linq;using System.Web;using System.Web.Mvc; public class TestController : Controller /*注意：默認(rèn)情況下，控制器里只創(chuàng)建一個Index的Action，這樣控制器在返回要瀏覽的視圖時會默認(rèn)去尋找Index視圖。如果開發(fā)者沒有創(chuàng)建Index視圖則會報錯。本例中可以將Index改為FirstView來實(shí)現(xiàn)。每個View在控制器中都對應(yīng)一個action。因此FirstView視圖就要在Controller里有相應(yīng)的Action。如代碼所示。*/ public ActionR

9、esultFirstView() ViewData"ABC" = "Test" return View(); 代碼說明：1. Controllers 文件夾包含負(fù)責(zé)處理用戶輸入和響應(yīng)的控制器類。MVC 要求所有控制器的名稱必須以 "Controller" 結(jié)尾。一般Visual Web Developer中已創(chuàng)建好一個 Home 控制器（用于首頁和關(guān)于頁面）以及一個 Account 控制器（用于登錄頁面）。開發(fā)人員在進(jìn)行MVC設(shè)計時，只需要在MVC中Controllers文件夾下添加相應(yīng)的控制器即可。本例中直接在MVC中添加一個名為T

10、est的控制器，然后再在控制器文件 Test中添加ViewData"ABC" = "Test"而return View();這句代碼就是控制器返回要瀏覽的視圖（也就是我們最后運(yùn)行看到的頁面文件）默認(rèn)狀態(tài)下（即View()不帶參數(shù)時）顯示的是與你的控制器名字一樣的view。當(dāng)然你也可以自己指定，例如return View("index")就是顯示與控制器index名字一樣的view。第四步：在Views文件夾下添加View。1.首先在Views文件夾下面新建一個文件夾2.命名新建文件夾注意：新建文件夾的命名一定要與你的Cont

11、roller命名一樣，即二者要同名。如：本例中Controller名字為Test，因此這里新建文件夾命名為Test。3.在新建文件夾中添加View命名為FirstView（注：此處View的命名可任意）4.在文件中添加代碼如下： ViewBag.Title = "FirstView"/視圖框標(biāo)題ViewData"ABC"<h2>FirstView</h2>代碼說明：代表在html中嵌入了C#代碼的cs就是csharp的簡稱，因此后綴名為.cshtml的文件就表示嵌入了C#代碼的html文件。備注： Views 文件夾Views&#

12、160;文件夾存儲的是與應(yīng)用程序顯示（用戶界面）相關(guān)的文件（HTML 文件）。根據(jù)語言的不同，這些文件的擴(kuò)展名可能是 html、asp、aspx、cshtml 以及 vbhtml。Views 文件夾包含與每個控制器相對應(yīng)的一個同名文件夾。在該同名文件夾下存放著一個與控制器中action同名的View視圖文件：這里的cs表示C Sharp。因此后綴名為.cshtml的文件表示嵌入了C Sharp代碼的html文件。嵌入的代碼前面要使用符號來進(jìn)行表示。Visual Web Developer 默認(rèn)狀態(tài)下已創(chuàng)建了一個 Account 文件夾、一個 Home 文件夾、一個 Shared 文件夾（在 V

13、iews 文件夾內(nèi)）。Account 文件夾包含用于注冊并登錄用戶帳戶的頁面。Home 文件夾用于存儲諸如首頁和關(guān)于頁之類的應(yīng)用程序頁面。Shared 文件夾用于存儲控制器間分享的視圖（模板頁和布局頁）。因此開發(fā)者在創(chuàng)建控制器時，要注意避開這些已被默認(rèn)使用的命名，以免產(chǎn)生沖突。鏈接：1.在MVC中，Controllers是C#類，通常繼承了類，每一個公有的方法我們稱為Action Method,這些Action方法通過ASP.NET Routing System(路由系統(tǒng))跟可配置的URL相關(guān)聯(lián)。為了實(shí)現(xiàn)一些Domain Model里面的操作，Controllers里面的語句會被執(zhí)行，之后選擇

14、一個View呈現(xiàn)到客戶端。下面的圖很好的展現(xiàn)了這樣一個過程:從上面的圖我們也能清楚的看到，View是不依賴Controller的，也不知道Controller的存在，更加不會發(fā)生直接的聯(lián)系。ASP.NET MVC3提供了一種新的View Engine-Razor，當(dāng)然以前的aspx視圖引擎仍然可以直接用的，在MVC里面，我們可以選擇任意的方式去實(shí)現(xiàn)Domain Model,而不會有任何的限制。這里也有傳統(tǒng)的三層架構(gòu)的圖解過程，如下所示:對比一下，我們也能體會MVC架構(gòu)的一些優(yōu)點(diǎn)吧。傳統(tǒng)的三層架構(gòu)也是一個很大的跨越?，F(xiàn)在被廣泛的應(yīng)用在了各種業(yè)務(wù)系統(tǒng)里面，它對應(yīng)UI的如何實(shí)現(xiàn)沒有任何限制，不管你是

15、Winform還是Webfrom，或是其他的，都可以應(yīng)用。在沒有太復(fù)雜的情況下提供了對關(guān)注點(diǎn)的分解。當(dāng)我們仔細(xì)看時，給DAL創(chuàng)建單元測試相對容易些。并且三層架構(gòu)跟MVC看起來有非常相似的地方，但是MVC跟三層卻是完全不同的東西，不要把兩者混淆了。按照老趙在MSDN里面的說法(我看過幾個相關(guān)的MSDN的MVC教程)，MVC是一種呈現(xiàn)模式，而三層是一種架構(gòu)模式。對應(yīng)三層：當(dāng)我們的UI層耦合了按鈕事件以后，會使得自動化的單元測試幾乎不可能實(shí)現(xiàn)。也有很多的變體，例如：Model-View-Presenter Pattern(MVP模式)，Model-View-View Model Pattern(MV

16、VM模式)第五步：調(diào)試運(yùn)行項(xiàng)目文件上右鍵選擇【調(diào)試】【啟動新實(shí)例】，如下圖所示：彈出如下框：注意：此時要在端口后面繼續(xù)輸入：/控制器名/視圖名，這樣才能看到你所想看到的視圖。如本例：http:/localhost:39241/Test/FirstView下面是本例中輸入后的結(jié)果：說明：上面的MVC代碼中，實(shí)際上Models中的代碼沒有起任何作用，它沒有與Controllers發(fā)生任何傳值。范例代碼詳解例1：上面的代碼僅僅展示了Controller與View的傳值?？珊喕缦拢篢estController.cs文件：using System;using System.Collections.Ge

17、neric;using System.Linq;using System.Web;using System.Web.Mvc; public class TestController : Controller public ActionResult FirstView() ViewData"ABC" = "Test"/*ViewData用于Dictionary中對數(shù)據(jù)的查找并建立key-value對，其格式為：ViewDatakey=value。本例中key為ABC字符串,value為常量字符串”Test”，需要注意的是這里的key值可以任意設(shè)定，因?yàn)楫?dāng)k

18、ey存在時，新創(chuàng)建的value將對先前的value進(jìn)行更新替換，而如果這個key不存在，系統(tǒng)會在該key和value之間創(chuàng)建一個key-value對。這樣系統(tǒng)在進(jìn)行字典數(shù)據(jù)查找時，通過這個key值即可找到這個value。*/ return View(); FirstView.cshtml文件： ViewBag.Title = "FirstView"/視圖框標(biāo)題/*在前面的TestController中系統(tǒng)已經(jīng)在”ABC”和”Test”之間創(chuàng)建了一個key-value對。這樣系統(tǒng)在進(jìn)行字典數(shù)據(jù)查找時，通過這個key值即可找到這個value。.cshtml文件中的C#代碼在服務(wù)

19、器端被解析，然后返還給瀏覽器客戶端進(jìn)行顯示。本例中ViewData"ABC"在服務(wù)器端解析后即被替換為字符串“Test”，用戶可以在調(diào)試運(yùn)行后，在網(wǎng)頁中通過右鍵選擇查看源碼來佐證這一點(diǎn)。代表在html中嵌入了C#代碼的cs就是csharp的簡稱，因此后綴名為.cshtml的文件就表示嵌入了C#代碼的html文件。*/ViewData"ABC"<h2>FirstView</h2>實(shí)例2Home文件using System;using System.Collections.Generic;using System.Linq;using

20、 System.Web;using System.Web.Mvc;using Com.IncTech.Website.Models;namespace Com.IncTech.Website.Controllerspublicclass HomeController : Controller / GET: /Home/ /*Controller在Action里面實(shí)現(xiàn)對Model中數(shù)據(jù)的操作，同時實(shí)現(xiàn)對View的返回*/public ActionResult Index() /定義一個Person的類對象并對該對象進(jìn)行初始化 Person p =new Person()Name ="T

21、om", Addr ="Shanghai", Age = 25;/*ViewData用于Dictionary中對數(shù)據(jù)的查找并建立key-value對，其格式為：ViewDatakey=value。本例中key為PersonInfo字符串,value為Person類對象p.需要注意的是這里的key值可以任意設(shè)定，因?yàn)楫?dāng)key存在時，新創(chuàng)建的value將對先前的value進(jìn)行更新替換，而如果這個key不存在，系統(tǒng)會在該key和value之間創(chuàng)建一個key-value對。這樣系統(tǒng)在進(jìn)行字典數(shù)據(jù)查找時，通過這個key值即可找到這個value。*/ ViewData&quo

22、t;PersonInfo" = p;return View(); 文件：using System;using System.Collections.Generic;using System.Linq;using System.Web;namespace Com.IncTech.Website.Modelspublicclass Person /字段privatestring addr;/*定義兩個共有屬性Name和Age，并通過get和set來實(shí)現(xiàn)傳值。C#中屬性只能進(jìn)行set和get操作，由這兩個操作實(shí)現(xiàn)傳值，它是系統(tǒng)封裝好的兩個接口操作，開發(fā)時直接操作使用即可，無需知曉其中實(shí)現(xiàn)細(xì)

23、節(jié)。*/publicstring Name get;set; publicint Age get;set; /*定義一個共有屬性Addr，并在屬性中對get和set操作進(jìn)行重載*/publicstring Addr get returnthis.addr; set this.addr =value; /*這里的this指針指向一個Person類對象。當(dāng)構(gòu)造函數(shù)在進(jìn)行傳值時，它將指向其傳參。而這里的value是一個關(guān)鍵字，當(dāng)構(gòu)造函數(shù)在進(jìn)行傳值時，它將指代其傳參*/ Index.cshtml文件：using Com.IncTech.Website.Models;var p = ViewData"PersonInfo" as Person;/*as Person相當(dāng)于強(qiáng)制類型轉(zhuǎn)換，即通過ViewData查找其中Key值為“PersonInfo”的Value值，并將其強(qiáng)制轉(zhuǎn)換為一個Person類對象，然后將其賦值給可變參數(shù)變量p。在前面的HomeController中已經(jīng)通過ViewData在“PersonInfo”和Person類對象p之間建立了一個k