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 下的更多相关文章

  1. 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/ ...

  2. ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 25. 过滤器

    在MVC的请求管道 并不是  asp.net core的请求管道.所以说Filter是专用于MVC的 贯穿特性,横穿关注点.比如授权.日志 这里的Authorize其实就是一个Filter,主要用来授 ...

  3. 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 ...

  4. ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 04. 中间件

    注册startup类可以配置我们web应用的启动逻辑,使用的就是UseStartUp方法,asp.net core就会实例化这个类 并调用startup类里面的两个方法ConfigureService ...

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

    前端库使用npm进行安装,需要先建立webpack.json文件 因为我们没有使用npm安装任何库,所以npm的文件夹是空的 这里是用于开发时构建时引用的库写在这里 这里用到bootStrap 开发时 ...

  6. 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/ 这是中文的地址 创建一个项目 名称.描述 ...

  7. ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 01. 创建项目 +项目结构和配置简介

    新建项目:Tutotial.Web 解决方案名称可以把web去掉 视频里面把git这个选项勾选了.我就不勾选了 dotnet CLI创建项目 首先必须安装好了.net Core的SDK dotnet ...

  8. ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 05.Controller 的路由

    视频地址: https://www.bilibili.com/video/av38392956/?p=5 这里面就包含了MVC相关的库 可以通过打开右侧的Nuget库进行查看 这里修改下 ,只需要静态 ...

  9. ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 06. Controller 返回View

    Controller父类会提供很多上下文的相关信息,还提供了很多封装的方法 返回的对象要求实现了IActionResult接口 继承父类,并引入命名空间 写this点就出现很多东西,这些就是上下文的信 ...

随机推荐

  1. 【flyway】开源的数据库版本管理工具【migration】

    开源的数据库版本管理工具[migration] 记录

  2. MySQL安装总是失败,提示缺少Visual Studio 2013 Redistributable

    MySQL安装总是失败,提示缺少Visual Studio 2013 Redistributable,但是很疑惑,我明明已经安装了呀,原来问题出在版本上,以下提供了一个可以匹配新版本mysql的版本: ...

  3. mac 安装ANT

    http://blog.csdn.net/crazybigfish/article/details/18215439 1.下载ant:官网下载 当前最新版是Apache Ant 1.9.3,可以下载那 ...

  4. iOS App 项目:会员卡管理系统设计方案

    1.需求描写叙述 店主须要管理自己的会员信息和充值卡信息以及消费纪录 店主觉得购买电脑和外设成本太高,并且店面没有地方容纳这些设备 店主希望通过手机来完毕这些功能.但尽量不产生流量.对网络要求较低 店 ...

  5. Microsoft Dynamics CRM Server 2013软件安装要求

    watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQveV9mMTIz/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/d ...

  6. Android用户界面设计:基本button

    Android用户界面设计:基本button 本文向你展示了在你的Android应用程序中创建一个简单的Button或ImageButton控件的步骤. 首先.你会学到怎样向你的布局文件里加入butt ...

  7. Monkey测试的参数

    一.Monkey测试简介 Monkey测试是Android平台自动化测试的一种手段,通过Monkey程序模拟用户触摸屏幕.滑动Trackball.按键等操作来对设备上的程序进行压 力测试,检测程序多久 ...

  8. 嵌入式开发之davinci--- 8148/8168/8127 中的添加算饭scd 场景检测 代码实现

    http://blog.csdn.net/mianhuantang848989/article/details/38035731 http://www.61ic.com/Article/DaVinci ...

  9. Reveal查看任意app的高级技巧

    本文转载至 http://blog.csdn.net/wbdwsqwwn/article/details/40476139 Reveal是一个很强大的UI分析工具,与其他几个功能相近的工具(比如Pon ...

  10. iOS开发——高级篇——多线程的安全隐患

    资源共享 1块资源可能会被多个线程共享,也就是多个线程可能会访问同一块资源 比如多个线程访问同一个对象.同一个变量.同一个文件 当多个线程访问同一块资源时,很容易引发数据错乱和数据安全问题   一.解 ...