ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 12. Views 下
ASP.NET Core MVC 13. 安装前端库

Partial VIew
就是部分View,他没有自己的数据,数据来自图中白色的那块,它的数据需要传进去,第一个参数是View的名称,第二个参数就是传入的数据,它没有自己对应的后台逻辑和数据

Home/Index.cshtml想把这个列表改成复用的,改成一个Partical View

起名通常是以下划线开始的


先把引入Partial的代码写上

Partial VIew的代码就是这个样,最上面声明类型

原来的代码注释掉

这里有个提示建议使用其他的方法,这里先不管他,先运行页面测试



改成异步的

最终的代码

把里面每行tr的数据再提取数据出来做Partial View

新建_StudentRow.cshtml


使用TagHelper的引入方式

运行测试,发生错误。这是由于上面的部分视图的代码 是异步引入导致的

先把这里的异步调用改成平常的 ,非异步的

运行效果 正常

Home/Index.cshtml也改成TagHelper的形式


刷新页面,运行正常

View Components
视图组件
例如在Index.cshtml页面显示上面是学生列表。下面显示课程的列表。下面应该单独从数据库查询或者其他数据源读取数据,也有可能显示在其他页面,这块也是复用的

特点

单独建文件夹ViewComponents

首先建立C#的类,ViewComponents像一个mini的mvc,所以他应该也有Controller。所有这个类就相当于是它的controller,然后它还对应一个Razor View.
名称通常也是一ViewComponent结尾的

继承自 ViewComponent

首先注入Repository

类似于Controller,返回类型是实现了IViewComponentResult接口的对象


这里会有个问题,如果我们返回的类型是字符串,那么View方法会把count当做ViewName,当做View的名称就回去寻找这个名为Count的字符串值的View

那么我们只要写上第一个参数View的名称,把参数当第二参数传过去就可以了。

view的name改叫做Default吧

所有的ViewCompent放在Shared/Components文件夹下。
一个ViewComponent和Comtroller类似,也要建立和ViewComponent同名的文件夹名称,因为。一个ViewComponent可能对应多个view。


使用这个ViewComponent

它是可以加参数的

参数是在哪里接收呢/


如果想每个页面都显示的话,就放在Layout里面

这样就每个页面都有这个总数

TagHelper的写法
vc冒号+ViewComponent的名称。注意都是小写的。不管你的ViewComponent名字是否是大写的,这里都要小写的

还需要引入命名空间

这次就有了效果

如果ViewComponent的名字是两个单词组成的叫做WelcomeStudentViewComponent
两个单词之前用短横线隔开,并且注意单词都要是小写的。中文叫做短横线命名方式

ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 12. Views 下的更多相关文章
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 03. 服务注册和管道
ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 03. 服务注册和管道 语雀: https://www.yuque.com/yuejiangliu/dotnet/ ...
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 25. 过滤器
在MVC的请求管道 并不是 asp.net core的请求管道.所以说Filter是专用于MVC的 贯穿特性,横穿关注点.比如授权.日志 这里的Authorize其实就是一个Filter,主要用来授 ...
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 02. Web Host 的默认配置
视频地址: https://www.bilibili.com/video/av38392956/?p=2 语雀 https://www.yuque.com/yuejiangliu/dotnet/ixt ...
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 04. 中间件
注册startup类可以配置我们web应用的启动逻辑,使用的就是UseStartUp方法,asp.net core就会实例化这个类 并调用startup类里面的两个方法ConfigureService ...
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 13. 安装前端库
前端库使用npm进行安装,需要先建立webpack.json文件 因为我们没有使用npm安装任何库,所以npm的文件夹是空的 这里是用于开发时构建时引用的库写在这里 这里用到bootStrap 开发时 ...
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 27. CICD Azure DevOps
VSTS做持续集成 后来改名叫做Azure Deveps https://azure.microsoft.com/zh-cn/services/devops/ 这是中文的地址 创建一个项目 名称.描述 ...
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 01. 创建项目 +项目结构和配置简介
新建项目:Tutotial.Web 解决方案名称可以把web去掉 视频里面把git这个选项勾选了.我就不勾选了 dotnet CLI创建项目 首先必须安装好了.net Core的SDK dotnet ...
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 05.Controller 的路由
视频地址: https://www.bilibili.com/video/av38392956/?p=5 这里面就包含了MVC相关的库 可以通过打开右侧的Nuget库进行查看 这里修改下 ,只需要静态 ...
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 06. Controller 返回View
Controller父类会提供很多上下文的相关信息,还提供了很多封装的方法 返回的对象要求实现了IActionResult接口 继承父类,并引入命名空间 写this点就出现很多东西,这些就是上下文的信 ...
随机推荐
- Oracle释放高水位线
/*****************************************************************原因:由于原导出数据库没有整理表空间其中主要包括两方面,一是用户产生 ...
- ASP.NETCore使用AutoFac依赖注入
原文:ASP.NETCore使用AutoFac依赖注入 实现代码 1.新建接口类:IRepository.cs,规范各个操作类的都有那些方法,方便管理. using System; using Sys ...
- open-falcon的插件机制
Plugin可以看做是对agent功能的扩充.对于业务系统的监控指标采集,最好不要做成plugin,而是把采集脚本放到业务程序发布包中,随着业务代码上线而上线,随着业务代码升级而升级,这样会比较容易管 ...
- BUPT复试专题—Python List(2014)
题目描述 在Python中,List (列表)是一种非常重要的数据结构.它与C/C++/Java中的 数组有些类似,但支持添加新元素时的动态扩展.在这个问题中,你需要处理如下 的几种对List的操作. ...
- STL 笔记(二) 关联容器 map、set、multimap 和 multimap
STL 关联容器简单介绍 关联容器即 key-value 键值对容器,依靠 key 来存储和读取元素. 在 STL 中,有四种关联容器,各自是: map 键值对 key-value 存储,key 不可 ...
- Codeforces Round #148 (Div. 1)
A wool sequence 表示一个序列中能够找到一个连续的子区间使得区间异或值为0 那么求的是不含这样的情况的序列个数 题目中数据范围是.在0~2^m - 1中选n个数作为一个序列 n和m都是1 ...
- ActiveMQ(四) 转
package pfs.y2017.m11.mq.activemq.demo04; import javax.jms.Connection; import javax.jms.ConnectionFa ...
- java-冒泡
一.java冒泡排序 冒泡排序(Bubble Sort)是一种简单的排序算法.它重复地走访过要排序的数列,一次比较两个元素,如果他们的顺序错误就把他们交换过来.走访数列的工作是重复地进行直到没有再需要 ...
- 【网站支付PHP篇】thinkPHP集成汇潮支付(ecpss)
系列目录 支付宝集成:http://www.cnblogs.com/nerve/p/3437879.html 系列说明 最近在帮朋友的系统安装支付模块(兑换网站积分),现在总结一些开发心得,希望对大家 ...
- 【 D3.js 进阶系列 — 1.2 】 读取 CSV 文件时乱码的解决方法
在 D3 中使用 d3.csv 读取 CSV 文件时,有时会出现乱码问题. 怎么解决呢? 1. 乱码问题 使用 d3.csv 读取 xxx.csv 文件时.假设 xxx.csv 文件使用的是 UTF- ...