广告位联系
返回顶部
分享到

ASP.NET Core MVC学习之视图组件(View Component)

asp.net 来源:互联网搜集 作者:秩名 发布时间:2019-08-17 19:08:29 人浏览
摘要

1.视图组件介绍 视图组件是 ASP.NET Core MVC 的新特性,类似于局部视图,但它更强大。视图组件不使用模型绑定,并且仅依赖于调用它时所提供的数据。 视图组件特点: 呈块状,而不是整个响应 包括在控制器和视图之间发现的相同的关注点和可测试性优点 可以拥

1.视图组件介绍

  视图组件是 ASP.NET Core MVC 的新特性,类似于局部视图,但它更强大。视图组件不使用模型绑定,并且仅依赖于调用它时所提供的数据。

  视图组件特点:

    呈块状,而不是整个响应

    包括在控制器和视图之间发现的相同的关注点和可测试性优点

    可以拥有参数和业务逻辑

    通常从布局页面调用

  视图组件可以用在任何需要重复逻辑且对局部视图来说过于复杂的情况,例如:

    动态导航菜单

    标签云(需要查询数据库)

    登录面板

    购物车

    最近发表的文章

    典型博客上的侧边栏内容

    将在每个页面上呈现的登录面板,根据用户的登录状态显示注销或者登录的链接

  视图组件有两部分组成,类(通常派生自 ViewComponent)和它返回的结果(通常是一个视图)。与控制器一样,视图组件可以是POCO,但大多数是利用 ViewComponent 派生的方法和属性。 

2.创建视图组件

  (1)视图组件类

  一个视图组件类通常可以通过以下任一方式创建:

    派生自ViewComponent

    使用 [ViewComponent] 属性装饰类,或从具有 [ViewComponent] 属性的类派生

    创建一个名称后缀为 ViewComponent 结尾的类

  像控制器一样,视图组件必须是 public ,非嵌套和非抽象类。视图组件名称是删除了 ViewComponent 后缀的类名,可以使用 ViewComponentAttribute.Name 属性显示指定。

  视图组件类优点:

    完全支持构造函数依赖注入

    不参与控制器生命周期,这意味着不能在视图组件中使用过滤器

  (2) 视图组件方法

  视图组件在 InvokeAsync 方法中定义其逻辑,并返回 IViewComponentResult 。参数直接来自视图组件的调用,而不是来自模型绑定。视图组件从不直接处理请求。通常,视图组件通过调用 View 方法初始化模型并将其传递给视图。总之,视图组件有以下特点:

    定义一个 InvokeAsync 方法并返回 IViewComponentResult。

    通常通过调用  ViewComponent View 方法初始化模型并将其传递给视图。

    参数来自调用方法,而不是 HTTP,没有模型绑定。

    不能直接作为 HTTP 端点访问,它是从你的代码(通常在视图中)调用的。视图组件不处理请求。

    在签名上重载,而不是当前 HTTP 请求的任何细节。

  (3) 视图搜索路径

  运行时在以下路径搜索视图:

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

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

  视图组件的默认视图名称是 Default,这意味着你的视图文件通常名为 Default.cshtml。你可以在创建视图组件结果或调用 View 方法时指定其他的视图名称。

3.调用视图组件

    要使用视图组件,请从视图中调用  @Component.InvokeAsync("视图组件名称",<匿名参数>)。参数将传递到 InvokeAsync 方法。如下:
 

 
@await Component.InvokeAsync("TopicRankList",new { days=5})

  
视图组件通常从视图中调用,但也可以从控制器方法中直接调用,虽然视图组件不像控制器那样定义终结点。

        public ActionResult Index()
        {
            return ViewComponent("TopicRankList", new { days = 5 });
        }

 

4.实战视图组件

  添加一个 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();
  }
 }

视图组件类可以在项目的任何文件夹中。 [ViewComponent] 特性可以更改用于引用视图组件的名称,例如,可以命名类为 XYZ,并应用 [ViewComponent] 特性:
 
 
[ViewComponent(Name="UserRankTop")]
public calss XYZ:ViewComponent

Invoke 方法返回列表,然后创建视图组件视图。

创建 View/Shared/Components 文件夹。这个文件夹必须名为 Components。然后在里面创建 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>

最后在视图中调用: @await Component.InvokeAsync("UserRankList", new { days=5})


版权声明 : 本文内容来源于互联网或用户自行发布贡献,该文观点仅代表原作者本人。本站仅提供信息存储空间服务和不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权, 违法违规的内容, 请发送邮件至2530232025#qq.cn(#换@)举报,一经查实,本站将立刻删除。
原文链接 : https://www.cnblogs.com/afei-24/p/11317885.html
相关文章
  • ASP.NET MVC使用Identity增删改查用户

    ASP.NET MVC使用Identity增删改查用户
    源码在这里:https://github.com/darrenji/UseIdentityCRUDUserInMVC,本地下载 在VS2013中创建一个MVC项目,用默认的无身份验证作为身份验证机制。 通过
  • WPF实现雷达扫描图的绘制介绍

    WPF实现雷达扫描图的绘制介绍
    实现一个雷达扫描图。 源代码在TK_King/雷达 (gitee.com) https://gitee.com/TK_King/radar,自行下载就好了 制作思路 绘制圆形(或者称之轮) 绘制分割
  • .Net Core之JWT授权介绍

    .Net Core之JWT授权介绍
    JSON Web令牌(JWT)是一个开放标准(RFC 7519),它定义了一种紧凑且自包含的方式,用于在各方之间安全地传输信息作为JSON对象。由于此信息
  • ASP.NET Core使用Middleware设置有条件允许访问路由

    ASP.NET Core使用Middleware设置有条件允许访问路由
    1.简介 有时,我们可能在Web API中包含一些具有调试功能的请求。比如我们上次的文章中为什么ASP.NETCore数据库连接串的值和appsettings.json配的
  • ASP.NET Core使用功能开关控制路由访问操作

    ASP.NET Core使用功能开关控制路由访问操作
    前言: 在前面的文章,我们介绍了使用Middleware有条件地允许访问路由(《ASP.NETCore使用Middleware设置有条件允许访问路由》)。 而对于一些
  • ASP.NET Core使用功能开关控制路由访问操作(续)

    ASP.NET Core使用功能开关控制路由访问操作(续)
    前言: 在前面的文章,我们介绍了? ?使用功能开关控制路由访问??。 但其实我们使用了2个条件做的判断: 1 2 3 4 var isDebugEndpoint = context.Re
  • 详解MediatR的使用
    环境: .NET 5 ASP.NET Core MVC (project) 1. MediatR MediatR .NET中的简单中介者模式实现,一种进程内消息传递机制(无其他外部依赖)。支持以同步或
  • .NET Core 3.0里新的JSON API介绍
    为什么需要新的 JSON API ? JSON.NET 大家都用过,老版本的 ASP.NET Core 也依赖于 JSON.NET 。 然而这个依赖就会引起一些版本问题:例如 ASP .NET
  • Net Core Web Api项目与在NginX下发布的方法
    前言 本文将介绍Net Core的一些基础知识和如何NginX下发布Net Core的WebApi项目。 测试环境 操作系统:windows 10 开发工具:visualstudio 2019 框架:
  • ASP.NET Core中的Http缓存使用
    Http响应缓存可减少客户端或代理对web服务器发出的请求数。响应缓存还减少了web服务器生成响应所需的工作量。响应缓存由Http请求中的he
  • 本站所有内容来源于互联网或用户自行发布,本站仅提供信息存储空间服务,不拥有版权,不承担法律责任。如有侵犯您的权益,请您联系站长处理!
  • Copyright © 2017-2022 F11.CN All Rights Reserved. F11站长开发者网 版权所有 | 苏ICP备2022031554号-1 | 51LA统计