在 ASP.NET Core 中,自定义标记提供程序(Tag Helper)用于在 Razor 视图中创建可重用的 HTML 生成逻辑。通过自定义 Tag Helper,你可以扩展 HTML 标签行为或创建新的语义化标签。
1. 创建自定义 Tag Helper 类
要实现一个自定义 Tag Helper,需定义一个继承自 TagHelper 的类,并重写 Process 方法。
使用 [HtmlTargetElement] 特性指定作用的 HTML 标签(如自定义标签名或属性) 通过 Process 方法修改输出内容,例如设置标签属性或内部 HTML示例:创建一个高亮文本的 Tag Helper
public class HighlightTagHelper : TagHelper
{
public override void Process(TagHelperContext context, TagHelperOutput output)
{
output.TagName = "span";
output.Attributes.SetAttribute("style", "background-color: yellow");
}
}
2. 注册 Tag Helper
在 _ViewImports.cshtml 文件中注册自定义 Tag Helper,使其在视图中可用。
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers @addTagHelper *, YourAssemblyName说明:YourAssemblyName 是包含 Tag Helper 的程序集名称,通常为项目名。
3. 在 Razor 视图中使用
注册后即可在 .cshtml 文件中使用自定义标签。
<highlight>这段文字将被高亮显示</highlight>
渲染结果:
<span style="background-color: yellow">这段文字将被高亮显示</span>
4. 支持属性传递(可选)
可以在 Tag Helper 类中添加公共属性,从标签上接收值。
public class HighlightTagHelper : TagHelper
{
public string? BackgroundColor { get; set; } = "yellow";
public override void Process(TagHelperContext context, TagHelperOutput output)
{
output.TagName = "span";
output.Attributes.SetAttribute("style", $"background-color: {BackgroundColor}");
}
}
使用方式:
<highlight background-color="lightblue">蓝色背景高亮</highlight>
基本上就这些。通过继承 TagHelper 并合理使用特性与属性,可以灵活控制 HTML 输出,提升视图代码的可读性和复用性。
