這篇文章給大家介紹如何在asp.net core中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 是開源,跨平臺,高性能,輕量級的 Web 應用構建框架,常用于通過 HTML、CSS、JavaScript 以及服務器腳本來構建網頁和網站。
關于如何在asp.net core中taghelper就分享到這里了,希望以上內容可以對大家有一定的幫助,可以學到更多知識。如果覺得文章不錯,可以把它分享出去讓更多的人看到。
當前標題:如何在asp.netcore中taghelper-創新互聯
文章出自:http://vcdvsql.cn/article38/csejsp.html
成都網站建設公司_創新互聯,為您提供動態網站、企業網站制作、App設計、品牌網站建設、Google、建站公司
聲明:本網站發布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網站立場,如需處理請聯系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源: 創新互聯