asp.net-core - C# 使用 TagHelper 将对象传递到 ViewComponent

Question

我正在尝试创建一个可以与 TagHelpers 一起使用的 ViewComponent，我在其中传入一个对象作为参数。

因此，例如，我有这个 ViewComponent——它最终可能会有更多参数:

public IViewComponentResult Invoke(string? pageTitle, string? description, string? headerView)

我想做这样的事情:

public class PageHeaderViewComponentOptions 
{
    public string pageTitle2;
    public string Description;
}

public IViewComponentResult Invoke(PageHeaderViewComponentOptions phvc)

像这样使用它:

<vc:page-header phvc:page-title2="Test Title"></vc:page-header>

但是，这是行不通的。

我也试过在参数类上显式设置属性信息如下:

[HtmlTargetElement("PageHeaderViewController")]
public class PageHeaderViewComponentOptions
{
    [HtmlAttributeName("page-title")]
    public string pageTitle2 { get; set; }
    public string Description;
}

也没有运气。

我的想法是我可以将该对象直接传递给 View 。输入这个，我想知道单独传递参数然后将每个参数分配给特定 View 模型的成员是否是一个更好的主意。

如有任何帮助，我们将不胜感激。

Answer 1

为了将对象添加为参数，您需要传递一个对象。

这个对象可以在 Controller 中创建并作为 View 模型的一部分传递，例如:

@model MyApp.MyViewModel

MyViewModel 是这样的:

public class MyViewModel
{
    public PageHeaderViewComponentOptions PhvcOptions { get; set; }
}

然后你像这样传递对象:

<vc:page-header phvc="PhvcOptions"></vc:page-header>

Razor 代码块内部:

@{
    var PhvcOptions = new PageHeaderViewComponentOptions
        {
            pageTitle2 = "Test Title";
        };
}

像这样传递对象的地方:

<vc:page-header phvc="@PhvcOptions"></vc:page-header>

甚至内联，看起来像这样:

<vc:page-header phvc="@(new PageHeaderViewComponentOptions { pageTitle2 = "Test Title" })"></vc:page-header>

虽然这违背了目的，但应该改用字符串输入:

<vc:page-header pageTitle2="Test Title"></vc:page-header>

对象的优点是它可以为空并且可以省略对象的字段。标签中需要出现字符串参数的地方，即使是空的。

当您可以使用 View 模型的一部分作为参数时，插入对象在 IMO 中也很有用，如上所示，或者当 View 模型实现不同的接口(interface)并因此可以作为参数本身传递时:

<vc:page-header phvc="Model"></vc:page-header>

MyViewModel 是这样的:

public class MyViewModel : IPageHeaderViewComponentOptions 
{
    public string pageTitle2 { get; set; }
}

和

public interface IPageHeaderViewComponentOptions 
{
    string pageTitle2;
}

我没有测试代码，可能有错别字。尤其是 @。但是你明白了。两种方法都应该有效。