Taghelper是一个服务端的组件,可以在Razor文件中创建和渲染HTML元素,类似于我们在Asp.Net MVC中使用的Html Taghelper。Asp.Net Core MVC内置的Tag Helper用于常见的任务,例如生成链接,创建表单,加载数据等。

  那么如何导入内置Tag Helpers呢?我们可以在项目的视图导入文件 Views/_ViewImports.cshtml 中引入。

@using StudentManagement.Models

@addTagHelper *,Microsoft.AspNetCore.Mvc.TagHelpers

  回顾一下以前在Asp.Net MVC中使用HtmlHelper,我们要使用<a>标签是这样做的

@Html.ActionLink("查看","details","home",new { id=})

  而现在,使用TagHelper变得更方便,我们可以对比一下

<a asp-controller="home" asp-action="details" asp-route-id="">查看</a>

@Html.ActionLink("查看","details","home",new { id=})

生成的html也是一样的

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title></title>
</head>
<body>
<div>
    <a href="/Home/Details/1">查看</a>
    <a href="/Home/Details/1">查看</a>
</div>
</body>
</html>

  那么为什么在Asp.Net Core MVC中要使用TagHelper呢?我们结合路由来看一下,假设路由开始是

app.UseMvc(routes =>
{
routes.MapRoute("default", "{controller=Home}/{action=Index}/{id?}");
});

  如果我们使用下面的硬编码方式和TagHelper方式得到的效果是一样的

<a href="/home/index/1" >查看</a>
<a asp-controller="home" asp-action="details" asp-route-id="1">查看</a>

  但是如果路由发生了变化,变成了下面的形式

app.UseMvc(routes =>
{
routes.MapRoute("default", "pre/{controller=Home}/{action=Index}/{id?}");
});

  那么硬编码的方式就无法访问了,而TagHelper方式依然能够正常访问,因为它是通过映射生成的,会自动加上pre/。

  接下来我们再看一下TagHelper里特殊的 Img tag helper。

<img asp-append-version="true" src="~/images/38.jpg" />

  Image TagHelper增强了<img>标签,为静态图像文件提供“缓存破坏行为”,它会生成唯一的散列值并将其附加到图片的URL中。此唯一字符串会提示浏览器从服务器重新加载图片,而不是从浏览器缓存重新加载。只有当磁盘上的文件发生更改时,它才会重新计算生成新的哈希值,缓存才会失效。

<img src="/images/38.jpg?v=ae5OTzlW663ZONSxqJlK_Eug8MyjukxUZsk0dwf3O9Y">

Asp.Net Core 入门(八)—— Taghelper的更多相关文章

  1. CentOS开发ASP.NET Core入门教程

    作者:依乐祝 原文地址:https://www.cnblogs.com/yilezhu/p/9891346.html 因为之前一直没怎么玩过CentOS,大多数时间都是使用Win10进行开发,然后程序 ...

  2. ASP.NET Core 入门教程 10、ASP.NET Core 日志记录(NLog)入门

    一.前言 1.本教程主要内容 ASP.NET Core + 内置日志组件记录控制台日志 ASP.NET Core + NLog 按天记录本地日志 ASP.NET Core + NLog 将日志按自定义 ...

  3. ASP.NET Core入门(一)

    大家好,很荣幸您点了开此篇文章,和我一起来学习ASP.NET Core,此篇文字为<ASP.NET Core入门>系列中的第一篇,本系列将以一个博客系统为例,从第一行代码,到系统发布上线( ...

  4. 【翻译】ASP.NET Core 入门

    ASP.NET Core 入门 原文地址:Introduction to ASP.NET Core         译文地址:asp.net core 简介           翻译:ganqiyin ...

  5. ASP.NET CORE 入门教程(附源码)

    ASP.NET CORE 入门教程 第一课 基本概念 基本概念 Asp.Net Core Mvc是.NET Core平台下的一种Web应用开发框架 符合Web应用特点 .NET Core跨平台解决方案 ...

  6. 小白开学Asp.Net Core 《八》

    小白开学Asp.Net Core <八> — — .Net Core 数据保护组件 1.背景 我在搞(https://github.com/AjuPrince/Aju.Carefree)这 ...

  7. asp.net core高级应用:TagHelper+Form

    上一篇博客我讲解了TagHelper的基本用法和自定义标签的生成,那么我就趁热打铁,和大家分享一下TagHelper的高级用法~~,大家也可以在我的博客下随意留言. 对于初步接触asp.net cor ...

  8. Asp.net Core 入门实战

    Asp.Net Core 是开源,跨平台,模块化,快速而简单的Web框架. Asp.net Core官网的一个合集,方便一次性Clone 目录 快速入门 安装 一个最小的应用 项目模板 路由 静态文件 ...

  9. 转载: ASP.NET Core入门系列文章

    今天在网上发现了ithome上的asp.net core 系列文章,对于新手入门还不错,这里转载一下,也方便查阅. [Day01] 從頭開始 [Day02] 程式生命週期 (Application L ...

随机推荐

  1. BZOJ2038【莫队算法】

    THE FIRST 莫队算法. /************************************************************** Problem: 2038 User: ...

  2. Lightoj 1008【规律】

    25 24 23 22 21 10 11 12 13 20 9 8 7 14 19 2 3 6 15 18 1 4 5 16 17 然后把这个转化成: 17 18 19 20 21 10 11 12 ...

  3. git 忽略 Pycharm 中的 workspace.xml 文件

    .gitignore 中要写上 workspace.xml 如果已经不幸之前commit workspace.xml 的话,必须执行以下命令 $ git rm --cached .idea/works ...

  4. CF960G Bandit Blues(第一类斯特林数)

    传送门 可以去看看litble巨巨关于第一类斯特林数的总结 设\(f(i,j)\)为\(i\)个数的排列中有\(j\)个数是前缀最大数的方案数,枚举最小的数的位置,则有递推式\(f(i,j)=f(i- ...

  5. js对象 数组Array详解 (参照MDN官网:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find)

    一:数组的创建方式: 1.采用直接量创建 var arr = [];//创建一个空数组 var arr2 = [1,2,3];//创建一个有三个元素的数组 2.采用构造函数创建 a.var arr1 ...

  6. NPOI用WorkbookFactory读写 2007以上格式文件(xlsx)

    //我用的最新的2.2.1版本 //第一步:引用DLL,5个全导入,包括ICSHARP.ZIP,是个开源压缩工具包.XLSX是压缩格式,需要它来解压 //第二部: using NPOI.SS.User ...

  7. C语言中位运算符异或“∧”的作用

    异或运算符∧也称XOR运算符.它的规则是若参加运算的两个二进位同号,则结果为0(假):异号则为1(真).即0∧=,∧=,∧=.如: 即071∧,结果为023(八进制数). “异或”的意思是判断两个相应 ...

  8. seq(2018.10.24)

    一道\(dp\)题... 期望\(40\)分解法 预处理:离散化,然后让连续一段值相同的元素合并为一个元素. 正式\(DP\): 显然有个最差策略为每个元素处都切一次,则切的次数为元素的个数\(-1\ ...

  9. BZOJ1218(线段树+扫描线)

    1.扫描线扫描x轴,线段树维护y轴. 2.坐标+1,线段树是从1开始维护.然后让边长--,这样就能包含边上的点了. 3.为了保证点在正方形内:在x轴上利用差分的思想,在x出Add(val),在x+r( ...

  10. MQTT进阶篇

            我们介绍了最流行的物联网协议MQTT的背景以及基本使用方法.在这篇文章中,我们会继续考察MQTT的高级玩法——与网页应用的交互.MQTT是基于TCP协议实现,基于HTTP的网页应用便无 ...