MVC5+EF6 入門完整教程六

原文:https://www.cnblogs.com/miro/p/4102867.htmlhtml

本篇咱們談談分部視圖(Partial View)。bootstrap

上篇文章提到過Partial和Action這兩個helper, 本篇文章主要就結合這兩個helper來說解分部視圖(Partial View)的應用。函數

文章提綱

  • 理論基礎
  • 詳細步驟
  • 總結

理論基礎 – 分部視圖

Partial View指能夠應用於View中以做爲其中一部分的View的片斷(相似於以前的user control), 能夠像類同樣,編寫一次, 而後在其餘View中被反覆使用。性能

通常放在"Views/Shared"文件夾中以共享。網站

建立Partial View:通常直接右鍵"Views/Shared"文件夾添加分部視圖。spa

使用Partial View有兩類helper :3d

Html.Partial / Html.RenderPartialhtm

Html.Action / Html.RenderActionblog

詳細步驟

大概五年前我開發過一個iPortal(相似於之前的iGoogle,如今iGoogle已經關閉), 其餘相似的參考網站:http://dropthings.omaralzabir.com/開發

裏面有一個個能夠自定義的widget,下面咱們就開發一個簡單的widget來講明Partial View的用法。

建立分部視圖

以下圖,建立 _PartialPageWidget.cshtml

咱們作一個簡陋的widget.

參考下面的圖,定義widget的HTML結構。

借用了bootstrap中panel的樣式,結構以下。

經過Html.Partial / Html.RenderPartial 使用

直接應用Html.Partial或Html.RenderPartial輔助方法比較簡單。

打開以前建好的Views/MVCDemo/Index.cshtml文件,添加以下內容:

顯示結果:

經過Html.Action / Html.RenderAction 使用

經過Html.Action/Html.RenderAction使用稍微複雜一點,分紅兩步。

  1. 在要顯示的View所對應的Controller中心增長一個Action.

    還用上面這個頁面,咱們在MVCDemoController.cs中增長一個Action

    作個簡單的說明:

    1. [ChildActionOnly] 表示這個Action只應做爲子操做進行調用。也就是說直接經過 controller/action這樣的網址是不能訪問的,會提示只能由子請求訪問的錯誤。
    2. 必須返回一個PartialView
  2. 在View中添加相關代碼

    顯示結果和上一種方法同樣

兩種使用方式小結

當View中引用了一個或多個分部視圖時,此View與各分部視圖默認獲得同樣的數據,也就是說View及其中全部的Partial View默認狀況下共享View中的ViewData和ViewBag.

須要使View和其中引入的Partial View有不一樣的數據,須要經過Html.Action/Html.RenderAction輔助方法, 並在對於被調用的Action中設置對應的數據。

另外還有幾點須要注意:

  1. XXX和RenderXXX的區別在於,一個是直接返回字符串,另一個是直接寫入到相應輸出流,所以不能直接放在代碼表達式中,必須放在代碼塊中。

    前面的示例中兩種寫法是等價的。RenderXXX有輕微的性能優點,在大量的RenderXXX運行時,才能反映出性能上的優點。

  2. Partial/RenderPartial一般在單獨的文件夾中應用視圖標記來幫助View渲染視圖模型的一部分。

    Action/RenderAction執行單獨Controller中的Action來顯示結果,提供了更多的靈活性,例如利用單獨的Controller傳遞不一樣值。文章最後咱們會舉個例子說明。

  3. Partial/RenderPartial和Action/RenderAction的參數分別是 partialView和 Action的名字。固然還有其餘的重載函數,咱們只說最經常使用的。應用時能夠按照咱們前面舉的例子。

Html.Partial和Html.Action差別舉例

最後咱們舉個例子說明兩種用法的差異。

  1. 新建一個Partial View

  2. Controller中新建兩個Action,SharedDateDemo和PartialViewDate.

    根據SharedDateDemo生成主View, PartialViewDate供Html.Action調用

  3. 主View: SharedDateDemo.cshtml分別顯示

    主View的時間;

    用Html.Partial調用Partial View的時間;

    用Html.Action調用Partial View的時間。

    顯示結果:

    上面結果能夠清晰的看到:

    1. View及其中全部的Partial View默認狀況下共享View中的ViewData和ViewBag
    2. 能夠經過Html.Action, 配合被調用的Action改變傳遞不一樣的數據

總結

本次咱們主要講解了Partial View這一實用功能的使用。

Html.Partial使用方便,在不須要改變數據內容時很是方便。

Html.Action 使用更加靈活,能夠根據業務要求按需定製Partial View顯示內容。

相關文章
相關標籤/搜索