asp.net core mvc Partial View 應用


      asp.net Core MVC支持部分視圖特性,當我們在不同的項目中共享一些網頁時,部分視圖是非常有用的。
1、部分視圖定義:
      部分視圖是在一個視圖中嵌套另外一個視圖。在父視圖中通過調用子視圖並將子視圖的HTML呈現給父視圖。
像一般視圖一樣,部分視圖使用.cshtml文件擴展名。
2、什么時候使用部分視圖:
      部分視圖是將大的視圖分解成較小視圖組件的一種有效的方法。能使視圖元素可以重復使用。通常布局元素在_Layout.cshtml
中指定。非布局的並且可以重復的內容可以封裝成部分視圖。
      如果你有一個復雜的界面有不同的邏輯組成這個界面,可以將不同的邏輯抽象出來,作為部分視圖,界面的不同部分都可以實現隔離。
並且整個頁面也變得簡單,這樣一個復雜的頁面就可以調用不同的partial view 來實現渲染。
      提示:我們應該遵循一條設計原則"Do not Repeat Yourself";
3、聲明部分視圖
      partial View的創建和別的視圖創建沒什么區別:您可以在View文件夾下面創建一個.cshtml文件。partial View 和常規視圖沒有什么區別
只是他們的渲染方式不同。您可以從控制器中返回一個ViewResult 給視圖。普通視圖和partial View的區別是partial View不運行_ViewStart.csthml。
(_ViewStart.cshtml 從名字就可以看出,開始一個視圖,是指在呈現任何View之前都要先執行_ViewStart.cshtml文件)
4、引用一個Partial View
   在一個視圖頁面里面,有幾種方法可以渲染一個部分視圖。比較簡單的方法是使用Html.Partial,它返回一個IHtmlString,可以通過使用@的前綴
來引用:
   @Html.Partial("AuthorPartial")
   PartialAsync是個異步方法
   @await Html.PartialAsync("AuthorPartial")
   可以使用RenderPartial渲染部分視圖(RenderPartialAsync是異步版本)。這個方法直接返回結果,它直接以流的方式輸出。
  @{
     Html.RenderPartial("AuthorPartial");
   }
   因為RenderPartial和RenderPartialAsync直接以流的形式返回,所以在性能方面是比較好,然而,在大多數場景下我們建議使用Partial和PartialAsync
5、查找一個PartialView
   當引用一個Partial View時,有如下幾種方式定位一個Partial View。
   @Html.Partial("ViewName") 首先在當前目錄下搜索ViewName,如果沒有找到,再去Share目錄查找ViewName名字。如果這兩個目錄下都沒有
   則會報錯。
   當前目錄顯示如下:

   

   @Html.Partial("ViewName.cshtml")  View必須在相同目錄下(根據文件全名稱調用)。

    如下所示調用Home文件:

    

   顯示結果如下:

 
  
   我們把PartialViewTest復制一份到Shered目錄下,並把Home下的PartialViewTest修改成PartialViewTest1.
   測試結果如下:

    

   顯示結果如下:

   

 

  下面的這兩中方式可以將部分視圖定義到不同的文件夾中:
   @Html.Partial("~/Views/Folder/ViewName.cshtml")根據應用程序的根目錄去查找。
   @Html.Partial("/Views/Folder/ViewName.cshtml")
   @Html.Partial("../Account/LoginPartial.cshtml") 使用相對路徑去定位。


6、在部分視圖中訪問數據

   當一個部分視圖被實例化時,它會得到父視圖ViewData字典的副本。你可以對部分視圖數據進行更新,但是不會影響到父視圖數據。

當部分視圖返回時,部分視圖中的視圖數據會發生變化。

   你可以通過實例化一個ViewDataDictionary傳遞給部分視圖:

   @Html.Partial("PartialName", customViewData)

   你也可以向部分視圖傳遞一個實體:

   @Html.Partial("PartialName", viewModel)

   你也可以同時傳遞一個ViewDataDictionary和實體到部分視圖:

   @Html.Partial("ArticleSection", section,
            new ViewDataDictionary(this.ViewData) { { "index", index } })

   

 

 

   下面代碼將顯示Views/Articles/Read.cshtml 視圖,它包含兩個partial views.向第二個partial view中傳遞了兩個參數。

  

@{
    ViewData["Title"] = "Read";
}
@using Microsoft.AspNetCore.Mvc.ViewFeatures;
@using ViewComponentSimple.Models;
@model Article

<h2>@Model.Title</h2>
@*Pass the authors name to Views\Shared\AuthorPartial.cshtml*@
@Html.Partial("AuthorPartial", Model.AuthorName)
@Model.PublicationDate

@*Loop over the Sections and pass in a section and additional ViewData
    to the strongly typed Views\Articles\ArticleSection.cshtml partial view.*@
@{ var index = 0;
    @foreach (var section in Model.Sections)
    {
        @Html.Partial("ArticleSection", section,
                    new ViewDataDictionary(this.ViewData) { { "index", index } })
        index++;
    }
}

 運行結果如下:

    

原文:https://docs.microsoft.com/zh-cn/aspnet/core/mvc/views/partial

   

 

   


   

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM