Shulou(Shulou.com)06/01 Report--

1. Inherit the parent class TagHelper and override the Process method (here is also an asynchronous method ProcessAsync that you can try for yourself)

two。 Note: how to use custom tags on the attempt page

3. Note: how to identify the attributes in the tag

4. Note: how do custom tag classes get paging parameters

5. Effect display

Let's share it one step at a time:

1. Inherit the parent class TagHelper and override the Process method (here is also an asynchronous method ProcessAsync that you can try for yourself)

First of all, we define a class named PagerTagHelper. Here we need to inherit the TagHelper class and override the Process method. TagHelper is located under the namespace Microsoft.AspNetCore.Razor.TagHelpers. Because the effect to be achieved here is mvc paging, we also need to obtain the reference Microsoft.AspNetCore.Mvc.TagHelpers through nuget, as shown in the figure:

The version here is 1.0.0-rc2-final, which was previously referenced directly through nuget. The default version is 1.0.0. As shown in the figure, two versions have been downloaded locally:

You need to pay attention to the version all the time, otherwise there will be an error when restoring the package.

two。 Note: how to use custom tags on the attempt page

If you want to use the defined tags in html, you need to pay attention to the naming rules such as the classes defined above:

The tag class must end with TagHelper, and then use it in the attempt as shown in the figure:

The pager here is the tag corresponding to the above PagerTagHelper. Remove the fixed TagHelper and then leave the Pager. Because the html tags are all lowercase, so they are pager. We first make a breakpoint in Process and then debug F5. We can see that we have entered the method of how to rewrite, so that the pager tag corresponds to the tag class.

3. Note: how to identify the attributes in the tag

We define an attribute in the custom tag class (here, because we want to do paging, we directly define the corresponding attribute class of a paging parameter as the attribute of the tag class). The paging parameter class is as follows:

View Code

Then take a screenshot of the defined attribute PagerOption, such as:

In order for the defined attribute to work in the tag, you need to pay attention to lowercase html, and then the first word is separated by'- 'from the following word. Here are the attributes that try to use the definition in the tag:

Note:

* word case

* split'- 'after the first word (the detail that the attribute name is PagerOption corresponding to pager-option cannot be ignored)

4. Note: how do custom tag classes get paging parameters

Here we use the attribute node in point 3 above to pass parameters. Let's take a look at the list data and paging data encapsulation we defined in Controller as follows:

View Code

Then in the custom paging tag attribute that you try to correspond to:

View Code

It's that simple. Pass the tag attributes directly to the attributes in the tag class. You need to debug the results with friends in F5 in more detail. These are the points for attention in this sharing. Note that the output.TagName = "div" defines a parent element that contains the re-element. Output.TagMode is the form of the tag in html, and then the whole code of the custom tag class:

View Code

5. Effect display

Paging effect:

Right-click to view the html element in the browser:

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.