1.視圖組件介紹

　　視圖組件是 ASP.NET Core MVC 的新特性，類似于局部視圖，但它更強(qiáng)大。視圖組件不使用模型綁定，并且僅依賴于調(diào)用它時(shí)所提供的數(shù)據(jù)。

　　視圖組件特點(diǎn)：

　　　　呈塊狀，而不是整個(gè)響應(yīng)

　　　　包括在控制器和視圖之間發(fā)現(xiàn)的相同的關(guān)注點(diǎn)和可測(cè)試性優(yōu)點(diǎn)

　　　　可以擁有參數(shù)和業(yè)務(wù)邏輯

　　　　通常從布局頁(yè)面調(diào)用

?

　　視圖組件可以用在任何需要重復(fù)邏輯且對(duì)局部視圖來說過于復(fù)雜的情況，例如：

　　　　動(dòng)態(tài)導(dǎo)航菜單

　　　　標(biāo)簽云（需要查詢數(shù)據(jù)庫(kù)）

　　　　登錄面板

　　　　購(gòu)物車

　　　　最近發(fā)表的文章

　　　　典型博客上的側(cè)邊欄內(nèi)容

　　　　將在每個(gè)頁(yè)面上呈現(xiàn)的登錄面板，根據(jù)用戶的登錄狀態(tài)顯示注銷或者登錄的鏈接

?

　　視圖組件有兩部分組成，類（通常派生自
ViewComponent）和它返回的結(jié)果（通常是一個(gè)視圖）。與控制器一樣，視圖組件可以是POCO，但大多數(shù)是利用?ViewComponent
派生的方法和屬性。

?

2.創(chuàng)建視圖組件

　　(1)視圖組件類

　　一個(gè)視圖組件類通?？梢酝ㄟ^以下任一方式創(chuàng)建：

　　　　派生自ViewComponent

　　　　使用 [ViewComponent] 屬性裝飾類，或從具有 [ViewComponent] 屬性的類派生

　　　　創(chuàng)建一個(gè)名稱后綴為?ViewComponent 結(jié)尾的類

　　像控制器一樣，視圖組件必須是 public ，非嵌套和非抽象類。視圖組件名稱是刪除了?ViewComponent
后綴的類名，可以使用?ViewComponentAttribute.Name 屬性顯示指定。

　　

　　視圖組件類優(yōu)點(diǎn)：

　　　　完全支持構(gòu)造函數(shù)依賴注入

　　　　不參與控制器生命周期，這意味著不能在視圖組件中使用過濾器

?

　　(2) 視圖組件方法

　　視圖組件在 InvokeAsync 方法中定義其邏輯，并返回 IViewComponentResult
。參數(shù)直接來自視圖組件的調(diào)用，而不是來自模型綁定。視圖組件從不直接處理請(qǐng)求。通常，視圖組件通過調(diào)用 View
方法初始化模型并將其傳遞給視圖?？傊晥D組件有以下特點(diǎn)：

　　　　定義一個(gè)?InvokeAsync 方法并返回?IViewComponentResult。

　　　　通常通過調(diào)用??ViewComponent View 方法初始化模型并將其傳遞給視圖。

　　　　參數(shù)來自調(diào)用方法，而不是 HTTP，沒有模型綁定。

　　　　不能直接作為 HTTP 端點(diǎn)訪問，它是從你的代碼（通常在視圖中）調(diào)用的。視圖組件不處理請(qǐng)求。

　　　　在簽名上重載，而不是當(dāng)前 HTTP 請(qǐng)求的任何細(xì)節(jié)。

?

　　(3) 視圖搜索路徑

　　運(yùn)行時(shí)在以下路徑搜索視圖：

　　Views/<controller_name>/Components/<view_component_name>/<view_name>

　　Views/Shared/Components/<view_component_name>/<view_name>

　　視圖組件的默認(rèn)視圖名稱是 Default，這意味著你的視圖文件通常名為 Default.cshtml。你可以在創(chuàng)建視圖組件結(jié)果或調(diào)用 View
方法時(shí)指定其他的視圖名稱。

?

3.調(diào)用視圖組件

?　　 要使用視圖組件，請(qǐng)從視圖中調(diào)用? @Component.InvokeAsync("視圖組件名稱",<匿名參數(shù)>)。參數(shù)將傳遞到
InvokeAsync 方法。如下：
@await Component.InvokeAsync("TopicRankList",new { days=5})
　　視圖組件通常從視圖中調(diào)用，但也可以從控制器方法中直接調(diào)用，雖然視圖組件不像控制器那樣定義終結(jié)點(diǎn)。
public ActionResult Index() { return ViewComponent("TopicRankList", new { days
=5 }); }
?

4.實(shí)戰(zhàn)視圖組件

　　添加一個(gè)?ViewCompoents 文件夾，然后添加?UserRankList類：
public class UserRankList : ViewComponent { private readonly DataContext _db;
private IMemoryCache _memoryCache; private string cacheKey = "topicrank"; public
UserRankList(DataContext db, IMemoryCache memoryCache) { _db= db; _memoryCache
= memoryCache; } public IViewComponentResult Invoke(int days) { var items = new
List<User>(); if (!_memoryCache.TryGetValue(cacheKey, out items)) { items =
GetRankUsers(10, days); } _memoryCache.Set(cacheKey,items,TimeSpan.FromMinutes(
10)); return View(items); } private List<User> GetRankUsers(int top, int days) {
return _db.User.OrderBy(o => o.Id).Take(top).ToList(); } }
　　視圖組件類可以在項(xiàng)目的任何文件夾中。 [ViewComponent] 特性可以更改用于引用視圖組件的名稱，例如，可以命名類為 XYZ，并應(yīng)用
[ViewComponent] 特性：
[ViewComponent(Name="UserRankTop")] public calss XYZ:ViewComponent
　　Invoke 方法返回列表，然后創(chuàng)建視圖組件視圖。

　　創(chuàng)建 View/Shared/Components 文件夾。這個(gè)文件夾必須名為?Components。然后在里面創(chuàng)建?UserRankList
文件夾，添加 Default.cshtml 視圖：
@model List<MVCTest.Models.User> <h2>user</h2> <div class="list-group">
@foreach (var item in Model) {<label>@item.Name</label> } </div>
　　最后在視圖中調(diào)用：@await Component.InvokeAsync("UserRankList", new { days=5})

?

• ? 上一篇：abp(net core)+easyui+efcore實(shí)現(xiàn)倉(cāng)儲(chǔ)管理系統(tǒng)——使用 WEBAPI實(shí)現(xiàn)CURD (十一)
• ? 下一篇：淺談賬號(hào)系統(tǒng)設(shè)計(jì)