1. 程式人生 > >MVC中的分部視圖

MVC中的分部視圖

ext copy data 語法 world! fonts replace art 區別

背景:

項目的工期馬上就要到了,由於後臺封裝的很好,我們只需要用心熟悉框架,接下來後臺的工作就是簡單的代碼工作了。原本以為最困難的時期已經過去,可沒想到前臺才是最困難的。

B/S的基礎十分薄弱,加上BS的項目做得少,遇到困難是避免不了的。霞姐說要界面靈活,那種在html裏加onclick的時代已經過去。今天就來說說界面靈活之一——分部視圖和Razor語法。

分部視圖:

在一定程度上,分部視圖與用戶控件十分類似。他們都可以提高內容或代碼的可重用性,但不同之處是,分部視圖不需要使用ViewState、PostBacks, and Events 等技術管理狀態。分部視圖與普通視圖的語法沒有區別。

優點:

1)簡單

2)可重用

3)分工合作

首先,創建一個分部視圖。在項目中右鍵——添加視圖,如圖:

技術分享

在介紹分部視圖如何使用之前,我們先介紹一種視圖引擎,就是在創建分部視圖時選擇的Razor。

Razor:

含義

一個模塊解決方案,用來優化HTML的生成,主要集中在代碼方面。Razor並不是一個新的編程語言,而是在讓程序員只使用現有的C#/VB(或其它)編程語言知識就能使用Razor,我們只不過在你選擇的編程語言裏,提供一個非常棒的基於模板生成HTML的標記語法。它擁有十分智能的感應輸入提示,用任何文本編輯器都可以進行編寫。可以支持對視圖執行單元測試。

在C#中,幾個簡單的語法規則:

代碼封裝在@{...}中

[email protected]

語句以分號結尾

[plain] view plain copy print?
  1. @*定義變量strMessage*@
  2. @{
  3. var str="Hello World!";
  4. var Message = " Razor";
  5. var strMessage=str + Message;
  6. }
  7. @*利用a標簽顯示*@
  8. <a>@strMessage</a>


顯示結果:

技術分享

Razor 網頁可被描述為帶有兩種內容的 HTML 頁面:HTML內容和 Razor代碼。使用 Razor語法ASP.NET 網頁擁有特殊的文件擴展名 cshtml使用C# 的Razor 語法)或者vbhtml(使用VB的 Razor)

對Razor有了簡單了解之後,我們來看分部視圖的簡單顯示問題。在普通視圖Index中,調用分部視圖。

創建Controller,並建立AddExamPartial分部視圖。

[csharp] view plain copy print?
  1. // GET: /Exam/
  2. //對應普通視圖
  3. public ActionResult Index()
  4. {
  5. return View();
  6. }
  7. //對應AddExamPartial分部視圖
  8. public PartialViewResult AddExamPartial()
  9. {
  10. return PartialView("AddExamPartial");
  11. }

把它們放到一個文件夾下,方便管理。


技術分享

在普通視圖Index中,增加調用語句。

[plain] view plain copy print?
  1. @{Html.RenderPartial("../../Views/Exam/AddExamPartial");}

添加考試的頁面就是一個分部視圖,已經顯示出來了,我們還可以更好的復用它。

技術分享

總結:

以上只是簡單的顯示分部視圖,並未涉及到傳值等數據共享。此外,過多分部視圖的使用會增加服務器的延遲,要控制得當。在你遇到十分困難的點時,那便是你薄弱的地方,抓住機會,這會是你收獲最大的時候。

MVC中的分部視圖