真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

成都創(chuàng)新互聯(lián)網(wǎng)站制作重慶分公司

ASP.NET5系列教程(三)：viewcomponents介紹

在ASP.NET MVC 6中，view components (VCs) 功能類似于虛擬視圖，但是功能更加強大。 VCs兼顧了視圖和控制器的優(yōu)點，你可以把VCs 看作一個Mini 控制器。它負責控制應用中的某一功能模塊，例如：

創(chuàng)新互聯(lián)服務項目包括天全網(wǎng)站建設、天全網(wǎng)站制作、天全網(wǎng)頁制作以及天全網(wǎng)絡營銷策劃等。多年來，我們專注于互聯(lián)網(wǎng)行業(yè)，利用自身積累的技術優(yōu)勢、行業(yè)經(jīng)驗、深度合作伙伴關系等，向廣大中小型企業(yè)、政府機構等提供互聯(lián)網(wǎng)行業(yè)的解決方案，天全網(wǎng)站推廣取得了明顯的社會效益與經(jīng)濟效益。目前，我們服務的客戶以成都為中心已經(jīng)輻射到天全省份的部分城市，未來相信會繼續(xù)擴大服務區(qū)域并繼續(xù)獲得客戶的支持與信任！

  • 動態(tài)導航菜單

  • 標簽云

  • 登錄面板

  • 購物車

  • 最近文章

  • 博客側邊欄

假如使用VC 創(chuàng)建了登錄面板，可以在很多場景中調用，例如：

  • 用戶沒有登錄

  • 用戶已登錄，需要退出使用其他帳號登錄或者管理其他帳號。

  • 如果當前登錄角色為管理員，渲染管理員登錄面板

你可以根據(jù)用戶的需求獲取數(shù)據(jù)進行渲染。添加VC到需要該視圖控件的頁面。

VC 包含兩部分，類 (一般繼承于ViewComponent) 和調用VC類中方法的Razor 視圖。類似于ASP.NET 控制器, VC 可以作為POCO使用，但是更多用戶傾向于使用從 VewComponent中繼承而來的方法和屬性。

 

VC的創(chuàng)建方式有:

  • 繼承ViewComponent.

  • 擁有 [ViewComponent] 屬性，或者從擁有 [ViewComponent]屬性派生的類。

  • 創(chuàng)建名稱已ViewComponent為后綴的類。

和controllers相同，VCs 必須是公開、非嵌套和非抽象的類。

添加view component 類

1. 創(chuàng)建名為ViewComponents的文件夾，View component 類可以包含在工程中的任何文件夾下。

2. 在ViewComponents 文件夾下創(chuàng)建PriorityListViewComponent.cs 類。.

3. 使用以下代碼替代PriorityListViewComponent.cs 文件原有代碼:

using System.Linq;using Microsoft.AspNet.Mvc;using TodoList.Models;namespace TodoList.ViewComponents
{  public class PriorityListViewComponent : ViewComponent
  {    private readonly ApplicationDbContext db;    public PriorityListViewComponent(ApplicationDbContext context)
    {
      db = context;
    }    public IViewComponentResult Invoke(int maxPriority)
    {      var items = db.TodoItems.Where(x => x.IsDone == false &&
                                        x.Priority <= maxPriority);      return View(items);
    }
  }
}

代碼注釋：

· 因為PriorityListViewComponent類繼承于ViewComponent，運行時將通過字符串"PriorityList" 從View中引用該類。在后續(xù)章節(jié)將會進行詳細闡述。

· [ViewComponent] 屬性用于設置引用VC的別名，例如，創(chuàng)建名稱為XYZ的類，我們可以通過以下代碼設置其引用別名:

[ViewComponent(Name = "PriorityList")]public class XYZ : ViewComponent

· 組件使用構造注入器使數(shù)據(jù)內(nèi)容生效，類似于 Todo 控制器的功能。

· 調用View中的公開方法，可以傳遞任意數(shù)量的參數(shù)。在異步版本中， InvokeAsync是可用的。在后續(xù)章節(jié)中我們將提及InvokeAsync 和多參數(shù)的使用方法。在之前的代碼中，公開方法的返回值為×××事項（ToDoItems），優(yōu)先級不低于maxPriority。

添加視圖控件

1. 在Views\Todo 文件夾下創(chuàng)建Components文件夾，注意這個文件夾需要命名為Components。

2. 在Views\Todo\Components 文件夾下創(chuàng)建PriorityList 文件夾。文件夾名稱必須和view component 類名稱一致。或者類名去除后綴名稱(如果在創(chuàng)建類時遵循慣例使用ViewComponent 作為后綴)。如果使用了ViewComponent屬性。

3. 在Views\Todo\Components\PriorityList  文件夾下創(chuàng)建Default.cshtml Razor 視圖，添加以下標記：

@model IEnumerable


Priority Items


    
    @foreach (var todo in Model)
    {        
  • @todo.Title
    • 
    }

 

Razor 視圖包含并且顯示了 TodoItems。如果 VC 調用方法沒有傳遞視圖的名稱 (如例子中所示)，那么默認情況下則調用視圖名稱對于方法。在后續(xù)的文章中，將闡述如何傳遞視圖名稱。

在views\todo\index.cshtml 視圖底部添加包含有調用PriorityListViewComponent的div：

@model IEnumerable


Priority Items


    
    @foreach (var todo in Model)
    {        
  • @todo.Title
    • 
    }

 

標記 @await Component.InvokeAsync() 表示該語法用于調用VC。第一個參數(shù)是我們要調用的組件名稱。其余參數(shù)參數(shù)傳遞給該VC。在這個例子中，我們傳遞“1”作為過濾的優(yōu)先級。InvokeAsync 方法可以包含任意數(shù)量的參數(shù)。

以下圖片顯示了優(yōu)先級列表：

@{
  ViewBag.Title = "ToDo Page";
}
  
ASP.NET vNext
       @if (Model.Count == 0)     {      
No Todo Items
    }    else     {                        @foreach (var todo in Model)         {                                                        }      
TODO
@todo.Title                @Html.ActionLink("Details", "Details", "Todo", new { id = todo.Id }) |               @Html.ActionLink("Edit", "Edit", "Todo", new { id = todo.Id }) |               @Html.ActionLink("Delete", "Delete", "Todo", new { id = todo.Id })            
              }    
@Html.ActionLink("Create New Todo", "Create", "Todo") 
  
       @Component.Invoke("PriorityList", 1)      

ASP.NET 5系列教程 (三)：view components介紹

注意： VC通常被添加到 Views\Shared 文件夾下，因為它并不僅僅是controller。

 

添加InvokeAsync 到優(yōu)先級組件

通過以下代碼更新PriorityListViewComponent類：

using System.Linq;using Microsoft.AspNet.Mvc;using TodoList.Models;using System.Threading.Tasks;namespace TodoList.ViewComponents
{    public class PriorityListViewComponent : ViewComponent
    {        private readonly ApplicationDbContext db;        public PriorityListViewComponent(ApplicationDbContext context)
        {
            db = context;
        }        // Synchronous Invoke removed.
        
        public async Task InvokeAsync(int maxPriority, bool isDone)
        {            string MyView = "Default";            // If asking for all completed tasks, render with the "PVC" view.
            if (maxPriority > 3 && isDone == true)
            {
                MyView = "PVC";
            }            var items = await GetItemsAsync(maxPriority, isDone);            return View(MyView, items);
        }        private Task> GetItemsAsync(int maxPriority, bool isDone)
        {            return Task.FromResult(GetItems(maxPriority, isDone));

        }        private IQueryable GetItems(int maxPriority, bool isDone)
        {            var items = db.TodoItems.Where(x => x.IsDone == isDone &&
                                                x.Priority <= maxPriority);            string msg = "Priority <= " + maxPriority.ToString() +                         " && isDone == " + isDone.ToString();
            ViewBag.PriorityMessage = msg;            return items;
        }

    }
}

注意: 這里移除了用于同步的Invoke 方法，使用更加強大的asynchronous方法替代。

修改 VC 視圖顯示優(yōu)先級信息：

@model IEnumerable


@ViewBag.PriorityMessage

最后，更新 views\todo\index.cshtml 視圖文件：

@* Markup removed for brevity. *@    
    
        @await Component.InvokeAsync("PriorityList", 2, true)    

以下圖片展示了PriorityListViewComponent類和Index視圖的修改效果：

ASP.NET 5系列教程 (三)：view components介紹

 

指定視圖名稱

一些復雜的VC在某些情況下也許需要去指定特定的視圖，以下代碼是通過InvokeAsync 方法指定視圖的方法：

public async Task InvokeAsync(int maxPriority, bool isDone)
{    string MyView = "Default";    // If asking for all completed tasks, render with the "PVC" view.
    if (maxPriority > 3 && isDone == true)
    {
        MyView = "PVC";
    }    var items = await GetItemsAsync(maxPriority, isDone);    return View(MyView, items);
}

 

更改 Views\Todo\Components\PriorityList\Default.cshtml 為 Views\Todo\Components\PriorityList\PVC.cshtml 視圖。更改PVC視圖控件來驗證它的使用：

@model IEnumerable


 PVC Named Priority Component View


@ViewBag.PriorityMessage

最后，需要更新 Views\Todo\Index.cshtml 文件：

刷新頁面查看更改效果。

 

在MVC6中，更改controller（或其他任何代碼）時，不需要重新編譯或重新運行應用，僅需要保存代碼并且刷新頁面即可。

以上即為今天希望和大家分享的view components知識，下一篇文章我們將介紹以下兩部分內(nèi)容：

敬請期待。

 

原文鏈接：http://www.asp.net/vnext/overview/aspnet-vnext/vc


網(wǎng)頁名稱：ASP.NET5系列教程(三)：viewcomponents介紹
分享網(wǎng)址：http://weahome.cn/article/jjcjed.html

其他資訊

在線咨詢

微信咨詢

電話咨詢

028-86922220（工作日）

18980820575（7×24）

提交需求

返回頂部