asp.net core razor自定义taghelper的方法
更新时间：2019年09月18日 16:08:36 作者：冯辉
这篇文章主要介绍了asp.net core razor自定义taghelper的方法，本文给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下
又一个新的名词(taghelper),通过taghelper是可以操作html标签、条件输出、更是自由添加内外元素。当然也内置了挺多的asp-开头的taghelper。
下面文章中也简单的带大家实现一个taghelper;
创建自定义html元素
创建一个类ButtonTagHelper
tagName为标签名称,下面创建一个button标签
using Microsoft.AspNetCore.Razor.TagHelpers;
namespace Ctrl.Core.Tag.Controls.Button
{
[HtmlTargetElement(“test-button”)]
public class ButtonTagHelper:TagHelper
{
public override void Process(TagHelperContext context, TagHelperOutput output)
{
output.TagName = “button”;
base.Process(context, output);
}
}
}
注册taghelper
创建完后可没法执行使用哦,在.cshtml通过某个标签比如form标签输入asp-,下面立刻就出现了一个列表 asp-…. ,这些是怎么做到的呢？因为在_ViewImports在我们创建项目工程时,已经提前引入了taghelper默认引入的是微软已经为我们写好的taghelper类库Microsoft.AspNetCore.Mvc.TagHelpers;
我们自定义的话也需要按照这个方式引入自定义的taghelper,下面我自己创建了一个类库名字为”Ctrl.Core.Tag”,我这个类库下面要存放所有的taghelper 我直接引入命名空间
@addTagHelper *,Ctrl.Core.Tag
如果想引入特定的taghelper如下
@addTagHelper 你的TagHelper , 命名空间
然后我们测试一下是否可用了,先生成一下项目,然后找个cshtml视图,输入刚才的前缀test会出来刚才定义的标签
添加上并运行项目查看刚才创建的button标签是否存在
添加自定义属性
上面需求是满足不了我们日常需求的,下面我们再定义一个元素属性
output.Attributes.SetAttribute(“class”, “btn btn-primary”);
然后再打开页面看效果就会看到class元素已经给加上了.
using Microsoft.AspNetCore.Razor.TagHelpers;
namespace Ctrl.Core.Tag.Controls.Button
{
[HtmlTargetElement(“test-button”)]
public class ButtonTagHelper:TagHelper
{
public override void Process(TagHelperContext context, TagHelperOutput output)
{
output.TagName = “button”;
output.Attributes.SetAttribute(“class”, “btn btn-primary”);
base.Process(context, output);
}
}
}
通过vs感知匹配按钮类型
上面能满足我们自定义标签了,但是可能使用起来有局限性,下面我给大家提供一个场景思路,后面大家可以自己进行扩展.
我创建一个枚举类为 CtrlButtonType
namespace Ctrl.Core.Tag.Controls.Button
{
/// <summary>
/// 按钮类型
/// </summary>
public enum CtrlButtonType
{
/// <summary>
/// 默认样式
/// </summary>
Default,
/// <summary>
/// 首选项
/// </summary>
Primary,
/// <summary>
/// 成功
/// </summary>
Success,
/// <summary>
/// 一般信息
/// </summary>
Info,
/// <summary>
/// 警告
/// </summary>
Warning,
/// <summary>
/// 危险
/// </summary>
Danger
}
}
在buttonTagHelper类中增加一个属性
public CtrlButtonType ButtonType { get; set; }
到cshtml中添加刚才那个页面的属性,会发现有提示,以及可以看到刚才枚举中定义的.这样通过vs感知以及通过类型指定我们刚才按钮的类型是不是很方面了.
namespace Ctrl.Core.Tag.Controls.Button
{
[HtmlTargetElement(“test-button”)]
public class ButtonTagHelper:TagHelper
{
public CtrlButtonType ButtonType { get; set; }
public override void Process(TagHelperContext context, TagHelperOutput output)
{
output.TagName = “button”;
output.Attributes.SetAttribute(“class”, “btn btn-“+ButtonType.ToString().ToLower());
base.Process(context, output);
}
}
}
<test-button button-type=”Success”></test-button>
总结
以上所述是小编给大家介绍的asp.net core razor自定义taghelper,希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对华域联盟网站的支持！
如果你觉得本文对你有帮助，欢迎转载，烦请注明出处，谢谢！
您可能感兴趣的文章:ASP.NET Core 2.0中Razor页面禁用防伪令牌验证如何ASP.NET Core Razor中处理Ajax请求ASP.NET Core Razor 页面路由详解asp.net core标签助手的高级用法TagHelper+Formasp.net core新特性之TagHelper标签助手Visual Studio 2017下ASP.NET CORE的TagHelper智能提示解决办法
asp.net
core
razor
taghelper
相关文章
ADO.Net 类型化DataSet的简单介绍今天学习了类型化DataSet,笔记整理如下，需要的朋友可以参考一下 2013-04-04
ASP.NET对路径"xxxxx"的访问被拒绝的解决方法小结异常详细信息: System.UnauthorizedAccessException: 对路径“D:/temp1/MyTest.txt”的访问被拒绝 2012-09-09
简单几步 实现vs2010对html5的支持微软从来不会让程序员用记事本写代码，如今html5马上就要火起来vs2010怎么会不支持html5呢？月月bird我将vs2010支持html5的方法整理了一下。 2016-05-05
c#生成缩略图不失真的方法实例分享使用.net的方法GetThumbnailImage生成的缩略图失真严重，这里推荐一种不失真生成缩略图的方法 2013-12-12
C#实现HTTP协议迷你服务器(两种方法)用C#语言实现HTTP协议的服务器类本文将以两种稍微有差别的方式用C#语言实现；要完成高性能的Web服务功能，通常都是需要写入到服务，如IIS，Apache Tomcat感兴趣的朋友可以了解下，或许对你学习c#有所帮助 2013-02-02
asp.net 对中文汉字的加密与解密代码一般的加密方法，解密比较复杂，所有大家看可以尝试用下面的代码。 2009-05-05
asp.net中MD5 16位和32位加密函数asp.net中MD5 16位和32位加密函数… 2007-03-03
asp.net 需要登陆的网站上下载网页源代码和文件最近有个项目需要从网络上下载网页信息和文件，并且需要登录后才能下载，所以做了个下载的通用类，供大家参考。 2009-05-05
asp.NET连接数的设置方法asp.NET连接数的设置方法，需要的朋友可以参考下 2012-12-12
ASP.NET Core MVC/WebApi基础系列2这篇文章主要介绍了.NET Core当中的模型绑定系统、模型绑定原理、自定义模型绑定、混合绑定、ApiController特性本质。 2019-04-04
最新评论
评论(0)