您好,登錄后才能下訂單哦!
1.繼承父類TagHelper并重寫Process方法(這里還有一個異步的方法ProcessAsync各位可以自己嘗試下)
2.注意:怎么在試圖頁面使用自定義標簽
3.注意:怎么識別標簽中的屬性
4.注意:自定義標簽類怎么獲取分頁參數
5.效果展示
下面一步一個腳印的來分享:
1.繼承父類TagHelper并重寫Process方法(這里還有一個異步的方法ProcessAsync各位可以自己嘗試下)
首先咋們定義一個類取名為PagerTagHelper,這里需要繼承TagHelper類,重寫Process方法,TagHelper位于命名空間Microsoft.AspNetCore.Razor.TagHelpers下面,因為這里要實現的效果是mvc分頁,所以還需要通過nuget獲取引用Microsoft.AspNetCore.Mvc.TagHelpers,引用后如圖:
這里的版本是1.0.0-rc2-final,之前直接通過nuget引用默認版本是1.0.0版本如圖本地已經下載了兩個版本:
各位需要注意版本一直,不然還原程序包的時候會出錯
2.注意:怎么在試圖頁面使用自定義標簽
如果要在html中使用定義的標簽,需要注意命名規則如圖上面定義的類:
標簽類必須以TagHelper結尾,然后在試圖中使用如圖所示:
這里的pager就是上面PagerTagHelper對應的標簽,去掉固定的TagHelper然后剩余Pager,因為html標簽都是小寫所以是pager,咋們先在Process中打個斷點然后F5調試,可以看到進入了咋們重寫的方法中,這樣pager標簽就和標簽類對應上了
3.注意:怎么識別標簽中的屬性
咋們在自定義標簽類中定義個屬性(這里因為要做分頁所以這里直接定義個分頁參數的對應屬性類當做標簽類的屬性),分頁參數類如下:
View Code
然后定義的屬性PagerOption截圖如:
這里要讓定義的屬性在標簽中能使用需要注意在html中小寫,然后首個單詞后面以'-'和后面的單詞隔開,下面是試圖標簽中使用定義的屬性:
注意:
*單詞大小寫
*首個單詞后'-'分割(屬性名稱是PagerOption對應pager-option這個細節不容忽視)
4.注意:自定義標簽類怎么獲取分頁參數
這里用到上面第3點的屬性節點來傳遞參數,先看一下咋們在Controller定義的列表數據和分頁數據封裝如下:
View Code
然后在試圖對應的自定義分頁標簽屬性中:
View Code
就是這么簡單,通過標簽屬性直接傳遞到標簽類中的屬性上,需要更詳細跟中的朋友可以F5調試下看看結果,以上就是這次分享的注意點,需要注意這幾個 output.TagName = "div"這個是定義一個包含了重新元素的父級元素,output.TagMode是標簽在html中表現形式,再來就是自定義標簽類的全部代碼:
View Code
5.效果展示
分頁效果:
右鍵查看瀏覽器中的html元素:
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。