门户网站系统开发建设,做一婚恋网站多少钱,设计大赛官网,广州自建网站哪家服务好ViewComponent1、View 组件介绍在ASP.NET CORE MVC中,View组件有点类似于partial views,但是他们更强大#xff0c;View组件不能使用model binding,当你调用它的时候仅仅依赖与你提供的数据一个View组件特点#xff1a;.呈现一大块而不是一个整体的响应。 .包含在控制器和视… ViewComponent1、View 组件介绍在ASP.NET CORE MVC中,View组件有点类似于partial views,但是他们更强大View组件不能使用model binding,当你调用它的时候仅仅依赖与你提供的数据一个View组件特点 .呈现一大块而不是一个整体的响应。 .包含在控制器和视图之间发现的相同的分离问题和可测试行优点。 .可以包含参数和业务逻辑。 .通常从布局页面调用。你可以在任何可重复使用的渲染逻辑的部分视图中用视图组件来替换。例如: .动态导航菜单 .标签云 .登陆面板 .购物车 .最近发表的文章 .侧栏内容在一个典型的博客 .登陆的面板信息可以显示在每一个页面上并显示要注销或登陆的链接具体取决于用户的登陆状态 视图组件有两部分组成类(通常派生自ViewComponent)和返回结果(通常为视图). 像控制器 一样视图组件可以是POCO,但大多数开发人员都希望利用从ViewComponent派生的方法和属性 2、创建一个View组件本节包含创建一个视图组件。在本文的后面我们将详细检查每个步骤并创建一个视图组件。 2.1 、View Component类 一个View组件的类可以通过下面方式创建 .继承ViewComponent .使用[ViewComponent]attribute 修饰的类或者继承自一个[ViewComponent]attribute类的子类。 .创建一个以ViewComponent结尾的类。 像控制器一样View组件必须是公共的、非嵌套的和非抽象类。视图组件名称是删除ViewComponent 后缀的类名称。 也可以使用ViewComponentAttribute.Name属性显式指定它。2.2、View Component 类 .支持构造函数注入 .不参与控制器的生命周期这意味着你不能在视图组件中使用过滤器2.3、View Component方法 视图组件在InvokeAsync方法中定义其逻辑,该方法返回IViewComponentResult.调用视图组件直接用参数,而不是模型绑定。视图组件从不直接处理请求。通常视图组件初始化模型并通过调用View方法将其传递给视图。 总是来说视图组件方法如下 .定义一个InvokeAsync 方法返回一个IViewComponentResult .通常通过调用ViewComponent View方法来初始化模型并将其传给视图。 .参数来自调用方法而不是HTTP没有模型绑定 .不能直接作为HTTP端点访问他们是通过代码调用(通常在视图中)。视图组件从不处理请求。 .在签名上重装,而不是来自当前HTTP请求的任何详细信息2.4、View 搜索路径 运行时View通过搜索下列路径 .Views/controller_name/Components/view_component_name/view_name .Views/Shared/Components/view_component_name/view_name 创建视图组件结果或调用VIew方法时可以指定不同的视图名称。 我们建议你为视图文件命名为Default.cshtml,并使用Views/Shared/Components/view_component_name/view_name路径 此示例中使用的PriorityList视图组件使用Views/Shared/Components/PriorityList/Default.cshtml作为视图组件视图。 一个视图组件默认的名称是Default.cshtml 并且使用Views/Shared/Components/view_component_name/view_name 路径. 在这个例子中我们使用PriorityList视图组件Views/Shared/Components/PriorityList/Default.cshtml2.4、调用一个视图组件 在View视图内通过如下调用视图组件 Component.InvokeAsync(Name of view component, anonymous type containing parameters) 参数将传递给InvokeAsync方法。在文章中开发的PriorityList视图组件是从Views/Todo/Index.cshtml视图中调用的。 在下面InvokeAsync方法调用两个参数 await Component.InvokeAsync(PriorityList, new { maxPriority 4, isDone true }) 通过Tag Helper调用视图组件 对于asp.net core 1.1和更高版本,你可以作为tagHelper调用一个视图组件。 vc:priority-list max-priority2 is-donefalse /vc:priority-list 上面代码中PriorityList视图组件被转化成priority-list.视图组件的参被转化成小写短横线属性。 调用视图组件的标签助手使用vc / vc元素。 视图组件指定如下 vc:[view-component-name] parameter1parameter1 value parameter2parameter2 value /vc:[view-component-name] 注意: 为了使用View Component作为Tag Helper必须使用addTagHelper指令注册包含View Component的程序集。例如如果你的View Component位于名为MyWebApp的程序集,请将以下指令添加到_ViewImports.cshtml文件中 addTagHelper *, MyWebApp 本教程中使用的InvokeAsync方法 await Component.InvokeAsync(PriorityList, new { maxPriority 4, isDone true }) 标签助手标记 vc:priority-list max-priority2 is-donefalse /vc:priority-list 在上面的示例中PriorityList视图组件成为priority-list。 在Controller中直接调用一个组件 视图组件通常从视图调用但您可以直接从控制器方法调用他们。虽然视图组件不定义端点(如控制器),但你可以轻松 实现返回ViewComponentResult内容的控制器操作。 下面代码View 组件直接通过控制器调用 public IActionResult IndexVC() { return ViewComponent(PriorityList, new { maxPriority 3, isDone false }); }2.5、创建一个ViewComponent 在代码中注意如下几点 .View Component 类能包含到项目任何目录下. .因为类名PriorityListViewComponent以ViewComponent结尾,运行时使用字符串PriorityList 稍后将会做详细解释. .[ViewComponent]能改变名字引用一个ViewComponent。例如我们可以命名XYZ类并应用ViewComponent attribute [ViewComponent(Name PriorityList)] public class XYZ : ViewComponent{} .上面的[ViewComponent]特性告诉ViewComponent选择器使用名称为PriorityList 当视图查找相关联的组件时。 并从视图引用类的组件时使用字符串PriorityList .组件使用了依赖注入,确保数据上下文是可用的。 .InvokeAsync是公开的方法可以直接从视图中调用,它可以传入任意数量的参数。 .InvokeAsync方法返回满足isDone和maxPriority参数的ToDo项集合2.6、创建视图组件 Razor View .创建Views/Shared/Components 文件夹.这个文件夹的名字必须是Components。 .创建Views/Shared/Components/PriorityList 文件夹,这个文件夹名称必须和ViewComponent类名称相同或者类名减去后缀 如果你使用了ViewComponet属性则类名必须匹配该属性. .创建一个 Views/Shared/Components/PriorityList/Default.cshtml Razor view: model IEnumerableViewComponentSample.Models.TodoItem h3Priority Items/h3 ul foreach (var todo in Model) { litodo.Name/li } /ul Razor View 返回一个列表并显示他们.如果这个View Component 的InvokeAsync方法没有传递一个View的名字根据契约Default视图名字将被使用。 在稍后我们将介绍如何传递一个视图的名字, 要覆盖特定控制器的默认样式请将视图添加到特定于控制器的视图文件夹例如Views / Todo / Components / PriorityList / Default.cshtml。 将包含调用优先级列表组件的div添加到Views/Todo/index.cshtml文件的底部 div await Component.InvokeAsync(PriorityList, new { maxPriority 2, isDone false }) /div await Component.InvokeAsync 展示了如何调用ViewComponent语法.第一个参数是我们想要调用视图组件的名称。后续参数传给组件 InvokeAsync可以接受任意数量的参数可以接受任何数量的参数。 你也可以通过Controller直接调用。 public IActionResult IndexVC() { return ViewComponent(PriorityList, new { maxPriority 3, isDone false }); }指定一个View名称 复杂的视图组件有时候可能需要指定一些非默认视图。下面代码显示了如何从InvokeAsync方法中指定PVC视图。更新PriorityListViewComponent类中的InvokeAsync方法。 public async TaskIViewComponentResult 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/Shared/Components/PriorityList/Default.cshtml文件重命名为Views/Shared/Components/PriorityList/PVC.cshtml 在PVC.cshtml中添加下面代码 { ViewData[Title] Default; } model IEnumerableViewComponentSimple.ViewComponents.TodoItem h3To do PVC View/h3 ul foreach (var todo in Model) { litodo.Name/li } /ul 运行应用程序并验证PVC视图。 检查视图路径 .将priority参数更改0以便不返回PVC视图。 .临时将Views/Todo/Components/PriorityList/Default.cshtml重命名为1Default.cshtml。 .运行App你会得到下面错误 .复制 Views/Todo/Components/PriorityList/1Default.cshtml 到 Views/Shared/Components/PriorityList/Default.cshtml. .向共享视图中添加一些标记以指示视图来自共享文件。 .测试共享文件中视图组件.如果你想确保编译时类型安全你可以用类名去替换硬编码(不用字符串).创建一个View视图不适用ViewComponent 后缀 using Microsoft.AspNetCore.Mvc;using Microsoft.EntityFrameworkCore;using System.Collections.Generic;using System.Linq;using System.Threading.Tasks;using ViewComponentSample.Models;namespace ViewComponentSample.ViewComponents{ public class PriorityList : ViewComponent { private readonly ToDoContext db; public PriorityList(ToDoContext context) { db context; } public async TaskIViewComponentResult InvokeAsync( int maxPriority, bool isDone) { var items await GetItemsAsync(maxPriority, isDone); return View(items); } private TaskListTodoItem GetItemsAsync(int maxPriority, bool isDone) { return db.ToDo.Where(x x.IsDone isDone x.Priority maxPriority).ToListAsync(); } }}使用nameof操作符:using ViewComponentSample.Modelsusing ViewComponentSample.ViewComponentsmodel IEnumerableTodoItemh2ToDo nameof/h2!-- Markup removed for brevity. -- }/tablediv await Component.InvokeAsync(nameof(PriorityList), new { maxPriority 4, isDone true })/div 原文https://docs.microsoft.com/zh-cn/aspnet/core/mvc/views/view-components 原文地址http://www.cnblogs.com/netcoder/p/7503876.html.NET社区新闻深度好文微信中搜索dotNET跨平台或扫描二维码关注
