关于TagHelper的那些事情——自定义TagHelper(内嵌TagHelper)

内嵌TagHelper

上一篇文章中提到有时候需要设计一种内嵌的TagHelper，如下：

<my name="yy" age="35">
   <location country="China" city="Shanghai" district="PuDong"></location>
</my>

location就是一个内嵌的TagHelper，我们可以在location里设置与它相关的Attributes，有时候设置有多层内嵌的TagHelper。那么怎样设计出这样的一个内嵌的TagHelper来呢？其实它和一般的TagHelper没什么的区别，大家可以利用前面我们介绍的来设计出它的TagHelper类及Attributes。和一般的TagHelper的主要区别是，它和父TagHelper关联。如何建立这种关联？这也是这章我们需要搞清楚的。

通过前面章节学习，我们知道设计的自定义TagHelper类都会继承于抽象类TagHelper，在这个类中有二个方法：

//同步处理
public virtual void Process(TagHelperContext context, TagHelperOutput output);

//异步处理
public virtual Task ProcessAsync(TagHelperContext context, TagHelperOutput output);

一般我们会根据实际情况来选择重载哪个方法。在TagHelper抽象类中，异步处理是调用同步处理方法。在这两个方法中参数相同，在这里详细介绍第一个参数context。

它的类型是TagHelperContext，主要是存放TagHelper相关的信息：

1. AllAttributes

   TagHelper支持的所有Attribute集合，它是只读的。

2. Items

   类型是IDictionary<object, object>，它是用来和其他TagHelper进行联系枢纽，

           /// <summary>
           /// Gets the collection of items used to communicate with other <see cref="ITagHelper"/>s.
           /// </summary>
           /// <remarks>
           /// This <see cref="IDictionary{object, object}"/> is copy-on-write in order to ensure items added to this
           /// collection are visible only to other <see cref="ITagHelper"/>s targeting child elements.
           /// </remarks>
           public IDictionary<object, object> Items { get; }
   

   从上面的描述可以看出，这个集合是copy-on-write，也就是说当前TagHelper在Items获取父TagHelper中的Items信息，也可以修改，删除或者添加某一项，但是不会影响到父TagHelper的Items值，同时也会将修改后的Items信息传给其子TagHelper，子TagHelper的任何修改不会影响到它。

在上面我们提到，设计支持内嵌TagHelper类，关键是要建立父子TagHelper的联系，看到这里，我想大家都应该清楚如何建立这种关联。对了，就是利用context中Items。

主要是在TagHelper的Process方法中做以下事情。　　

public virtual void Process(TagHelperContext context, TagHelperOutput output)
{
   // 从context.items获取父TagHelper信息
   // 处理自身Attributes
   // 将自身信息存放在context.items中
   // 处理自己的子TagHelper
}

更具体的例子如下：

    //定义父TagHelper
    public class PersonTagHelper : TagHelper
    {
        public string Name
        {
            get { return Person.Name; }
            set { Person.Name = value; }
        }
        public int Age
        {
            get { return Person.Age; }
            set { Person.Age = value; }
        }

        private Person _person;
        private Person Person
        {
            get
            {
                return _person ?? (_person = new Person());
            }
            set
            {
                _person = value;
            }
        }
        public override void Process(TagHelperContext context, TagHelperOutput output)
        {
            // 保存信息给子TagHelper使用
            context.Items["Parent"] = Person;
            // 执行并获取子TagHelper内容
            context.GetChildContentAsync();

            // 输出html元素和启动脚本
            // 这里会用到第二个参数output，后面会介绍到如何使用。
        }
    }

    // 定义子TagHelper
    public class LocationTagHelper: TagHelper
    {
        public string Country { get; set; }
        public string City { get; set; }
        public string District { get; set; }

        public override void Process(TagHelperContext context, TagHelperOutput output)
        {
            // 获取来自父TagHelper的信息，并保存到变量里去
            var parent = context.Items["Parent"] as Person;
            // 处理Attributes的设置
            parent.Location.Country = Country;
            parent.Location.City = City;
            parent.Location.District = District;
            // 保存自身信息，便于子TagHelper使用
            context.Items["Parent"] = parent.Location;
            // 执行并获取子TagHelper内容
            context.GetChildContentAsync();
        }
    }

    // 定义了父TagHelper中对应的对象实例
   // 大家可以根据各自需求，决定是否需要定义这样一个类型
    public class Person
    {
        public string Name { get; set; }
        public int Age { get; set; }

        private Location _location;
        public Location Location
        {
            get { return _location ?? (_location = new Location()); }
        }
    }

    // 定义子TagHelper中数据类型
    // 大家可以根据各自需求，决定是否需要定义这样一个类型
    public class Location
    {
        public string Country { get; set; }
        public string City { get; set; }
        public string District { get; set; }
    }

对于类Person和Location的定义大家可以根据具体情况来决定是否需要。

这个例子只是简单展示如何利用Items信息来构建父子TagHelper间的联系，大家在具体的项目开发中根据实际需求，写出不一样的代码来，但有一点不变，就是要利用Items。