Asp.net core 学习笔记 ( ViewComponent 组件 )
2017-10-29 09:06
1021 查看
refer : https://docs.microsoft.com/en-us/aspnet/core/mvc/views/view-components
core 和 Angular 的 component 是不同的.
core 的 component 只是对 partial view 的升级而已.
从前 partial view 只是一个 view 的封装, component 则是 controller + view 的封装
所以方便一些.
首先定义一个 class 继承 ViewComponent, component 的名字就是 class name, 当然我们也可以改它,
调用
上面有 3 种调用的方式
第一种是写入 component 名字
第二种是通过 nameof 找到 class, 如果你修改了名字, 那么这个调用是会坏掉的哦.
第三种是通过 element 模式 (需要在 _ViewImports.cshtml 添加 @addTagHelper *, Project, Project 是我项目的名字, 直接放整个项目 assembly 就可以了)
ViewComponent 的模板和一般的 controller 查找不同, 一般的 controller View name 是 Index.cshtml
而 ViewComponent 则是 Components/ComponentName/Default.cshtml
core 和 Angular 的 component 是不同的.
core 的 component 只是对 partial view 的升级而已.
从前 partial view 只是一个 view 的封装, component 则是 controller + view 的封装
所以方便一些.
首先定义一个 class 继承 ViewComponent, component 的名字就是 class name, 当然我们也可以改它,
[Area("Web")] [ViewComponent(Name = "keatkeat")] //修改 name public class MyHeader : ViewComponent { private DB db { get; set; } public MyHeader( DB db ) { this.db = db; } public Task<IViewComponentResult> InvokeAsync(string value) //调用时可以传参哦 { var vm = new ViewModel { name = value }; return Task.FromResult<IViewComponentResult>(View(vm)); } }
调用
@addTagHelper *, Project @{ var value = "keatkeat87"; } @await Component.InvokeAsync("keatkeat",value) @await Component.InvokeAsync(nameof(Project.Web.ViewComponents.MyHeader.MyHeader),value) <vc:keatkeat value="@value" ></vc:keatkeat>
上面有 3 种调用的方式
第一种是写入 component 名字
第二种是通过 nameof 找到 class, 如果你修改了名字, 那么这个调用是会坏掉的哦.
第三种是通过 element 模式 (需要在 _ViewImports.cshtml 添加 @addTagHelper *, Project, Project 是我项目的名字, 直接放整个项目 assembly 就可以了)
ViewComponent 的模板和一般的 controller 查找不同, 一般的 controller View name 是 Index.cshtml
而 ViewComponent 则是 Components/ComponentName/Default.cshtml
相关文章推荐
- [转]asp.net core视图组件(ViewComponent)简单使用
- Asp.Net core 视图组件ViewComponent
- Asp.Net core 视图组件ViewComponent
- ASP.NET CORE 自定义视图组件(ViewComponent)注意事项
- asp.net core视图组件(ViewComponent)简单使用
- (5)学习笔记 ) ASP.NET CORE微服务 Micro-Service ---- 熔断降级(Polly)
- ASP.NET MVC学习笔记:(二)return View(...)
- ASP.NET Core 2.0系列学习笔记-配置文件
- Asp.net core 学习笔记 ( HttpClient )
- ASP.NET MVC学习笔记-ViewEngine 深入解析与应用实例
- Asp.Net Ajax 学习笔记24 利用Microsoft AJAX Library开发客户端组件(中)
- ASP.NET MVC学习笔记-Controller与View传值
- (6)学习笔记 ) ASP.NET CORE微服务 Micro-Service ---- AOP框架
- (8)学习笔记 ) ASP.NET CORE微服务 Micro-Service ---- Ocelot网关(Api GateWay)
- ASP.NET Core MVC之ViewComponents(视图组件)知多少?
- ASP.NET Core 2 学习笔记(八)URL重写
- Asp.Net Ajax 学习笔记12 基于Microsoft AJAX Library扩展客户端组件
- [译]【NetCore学习笔记之Anchor TagHelper】ASP.NET Core MVC Anchor Tag Helper
- Asp.net core 2.0.1 Razor 的使用学习笔记(五)
- Asp.net core 学习笔记 ( Router 路由 )