【问题标题】:How Could I Improve the Design of this HtmlHelper Extension?如何改进这个 HtmlHelper 扩展的设计?
【发布时间】:2023-03-28 11:18:01
【问题描述】:

注意:我最初发布了一个与here 类似的问题,但我决定重新发布,因为我克服了原始问题并在此过程中修改了设计。我认为它需要一个新的话题,因为随着设计的改变,问题也从根本上改变了。我只是想明确一点,我并不想用同样的问题来淹没 SO。

问题:我一直在做一个小实验,看看是否可以创建一个辅助方法来将我的任何类型序列化为我指定的任何类型的 HTML 标记。我想我应该把它提交给社区,以帮助我识别设计中的代码异味或其他缺陷/效率低下,从而改进设计。

基本上,我的这段代码将生成一个带有多个选项的选择框(或任何其他 Html 元素):

// the idea is I can use one method to create any complete tag of any type 
// and put whatever I want in the content area. 
// This makes the generation of all html completely testable

<% using (Html.GenerateTag<SelectTag>(Model, new { href = Url.Action("ActionName") })) { %>
     // model is type ShareClass. It contains a list of Funds
    <%foreach (var fund in Model.Funds) {%>
        <% using (Html.GenerateTag<OptionTag>(fund)) { %>
            <%= fund.Name %>
        <% } %>
    <% } %>
<% } %>

这将产生以下 html 输出:

<select shareclassname="MyShareClass" 
        shareclasstype="ShareClass_A" 
        href="/Ctrlr/ActionName">
    <option selected="selected" id="1" name="MyFund_1">MyFund_1</option>
    <option id="2" name="MyFund_2">MyFund_2</option>
    <option id="3" name="MyFund_3">MyFund_3</option>
    <option id="N" name="MyFund_N">MyFund_N</option>
</select>

这个 Html.GenerateTag 助手定义为:

public static MMTag GenerateTag<T>(this HtmlHelper htmlHelper, object elementData, object attributes) where T : MMTag
{
    return (T)Activator.CreateInstance(typeof(T), htmlHelper.ViewContext, elementData, attributes);
}

根据 T 的类型,它将创建以下定义的类型之一:

public abstract class HtmlTypeBase : MMTag
{        
    public HtmlTypeBase(ViewContext viewContext, params object[] elementData)
    {
        _tag = this.GetTag();
        base._viewContext = viewContext;
        base.MergeDataToTag(viewContext, elementData);
    }

    public abstract TagBuilder GetTag();
}

public class SelectTag : HtmlTypeBase
{
    public SelectTag(ViewContext viewContext, params object[] elementData) 
        : base(viewContext, elementData)
    {
        base._tag = new TagBuilder("select");
    }

    public override TagBuilder GetTag()
    {
        return new TagBuilder("select");
    }
}

public class OptionTag : HtmlTypeBase
{
    public OptionTag(ViewContext viewContext, params object[] elementData)
        : base(viewContext, elementData)
    {
        base._tag = new TagBuilder("option");
    }

    public override TagBuilder GetTag()
    {
        return new TagBuilder("option");
    }
}

public class AnchorTag : HtmlTypeBase
{
    public AnchorTag(ViewContext viewContext, params object[] elementData)
        : base(viewContext, elementData)
    {
        base._tag = new TagBuilder("a");
    }

    public override TagBuilder GetTag()
    {
        return new TagBuilder("a");
    }
}

这是MMTag的定义:

public class MMTag : IDisposable
{
    internal bool _disposed;
    internal ViewContext _viewContext;
    internal TextWriter _writer;
    internal TagBuilder _tag;

    public MMTag() {}

    public MMTag(ViewContext viewContext, params object[] elementData){ }

    protected void MergeDataToTag(ViewContext viewContext, object[] elementData)
    {
        MergeTypeDataToTag(elementData[0]);
        MergeAttributeDataToTag(elementData[1]);

        this._viewContext = viewContext;

        this._viewContext.Writer.Write(_tag.ToString(TagRenderMode.StartTag));
    }

    private void MergeAttributeDataToTag(object attributeData)
    {
        var dic = new Dictionary<string, object>(StringComparer.OrdinalIgnoreCase);
        var attributes = attributeData;
        if (attributes != null)
        {
            foreach (PropertyDescriptor descriptor in TypeDescriptor.GetProperties(attributes))
            {
                object value = descriptor.GetValue(attributes);
                dic.Add(descriptor.Name, value);
            }
        }

        _tag.MergeAttributes<string, object>(dic);
    }

    private void MergeTypeDataToTag(object typeData)
    {
        Type elementDataType = typeData.GetType();
        foreach (PropertyInfo prop in elementDataType.GetProperties())
        {
            if (prop.PropertyType.IsPrimitive || prop.PropertyType == typeof(Decimal) || prop.PropertyType == typeof(String))
            {
                object propValue = prop.GetValue(typeData, null);
                string stringValue = propValue != null ? propValue.ToString() : String.Empty;
                _tag.Attributes.Add(prop.Name, stringValue);
            }
        }
    }

    #region IDisposable 
    public void Dispose()
    {
        Dispose(true /* disposing */);
        GC.SuppressFinalize(this);
    }

    protected virtual void Dispose(bool disposing)
    {
        if (!_disposed)
        {
            _disposed = true;
            if (disposing)
            {
                _writer = _viewContext.Writer;
                _writer.Write(_tag.ToString(TagRenderMode.EndTag));
            }
        }
    }
    #endregion
}

我还应该补充一点,Fund & ShareClass 被定义为:

public class Fund
{
    public int ID { get; set; }
    public string Name { get; set; }

    public Fund()
    {
        this.ID = 123;
        this.Name = "MyFund";
    }

    public Fund(int id, string name)
    {
        this.ID = id;
        this.Name = name;
    }
}

public class ShareClass
{
    public string ShareClassName { get; set; }
    public string ShareClassType { get; set; }
    public IEnumerable<Fund> Funds { get; set; }

    public ShareClass(string name, string shareClassType)
    {
        this.ShareClassName = name;
        this.ShareClassType = shareClassType;
    }
}

【问题讨论】:

    标签: c# asp.net-mvc oop


    【解决方案1】:

    您是否考虑过使用约定来创建您的标签?看起来您的视图中需要大量重复代码。每次你想要一个下拉菜单时,你都必须复制六行。

    使用固执己见的输入构建器会大大简化您的视图,但需要您进行一些设置。根据我的经验,这种设置非常值得您在路上节省时间!

    输入构建器的想法是您为视图模型上的属性指定输入元素(或显示或标签等)。然后,您的输入构建器框架会检查属性的类型和属性,并确定要呈现的正确输入类型。

    以下是我当前项目中如何构建下拉菜单的示例:

    //View Model
    [OptionsFrom("Years")]
    public int ContractYear{ get; set; }
    
    public IDictionary Years
    {
        get
        {
            var currentYear = DateTime.Today.Year;
            return Enumerable.Range(0, 10).ToDictionary(i => currentYear + i, i => (currentYear + i).ToString());
        }
    }
    
    //View
    Html.InputFor(x => x.ContractYear);
    

    Here 是使用 MVCContrib 的输入构建器的演练。我知道 MVC2 中也有一些输入构建器支持,但我不熟悉它。在我看来,最好的基于约定的构建器可以从 FubuMVC 获得。我有一篇关于如何将它们与 ASP.NET MVC 一起使用的帖子 here。我还没有任何关于如何配置它们的帖子,尽管我很快就计划好了。

    【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2017-05-03
    • 2011-01-27
    • 2011-08-31
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-03-31
    • 1970-01-01
    相关资源
    最近更新 更多