Blazor模板化组件CascadingValue

时间:2020-01-07 21:01:27

标签: blazor

我正在尝试通过[CascadingParameter]获取模板化组件中的context.Id(主键)值,因此可以在NavigationManager中使用它。但它始终返回0。 我该怎么做?

非常感谢!

@typeparam TItem
@inject NavigationManager nav

<table class="table">
    <thead>
        <tr>@TableHeader</tr>
    </thead>
    <tbody>
        @foreach (var item in Items)
        {
            <tr @onclick="@(() => nav.NavigateTo($"dossiers/{PK}/basisgegevens"))">@RowTemplate(item)</tr>
        }
    </tbody>
    <tfoot>
        <tr>@TableFooter</tr>
    </tfoot>
</table>

@code {
    [Parameter] public List<TItem> Items { get; set; }
    [Parameter] public RenderFragment TableHeader { get; set; }
    [Parameter] public RenderFragment<TItem> RowTemplate { get; set; }
    [Parameter] public RenderFragment TableFooter { get; set; }

    [CascadingParameter] int PK { get; set; }

}

实施:

<GenericTable Items="dossiers">
    <TableHeader>
        <th>ID</th>
        <th>Naam</th>
        <th>Vorm</th>
        <th>Ondernemingsnummer</th>
    </TableHeader>
    <RowTemplate>
        <CascadingValue Value="@context.Id">
            <td>@context.Id</td>
            <td>@context.Name</td>
            <td>@context.LegalEntityType.Name</td>
            <td>@context.Ondernemingsnummer</td>
        </CascadingValue>
    </RowTemplate>
</GenericTable>

2 个答案:

答案 0 :(得分:1)

您不应使用CascadingValue将值级联到可能已经呈现的组件。该值将始终为零。创建组件时,在为CascadingValue组件的Value参数分配“ @ context.Id”之前,首先要设置其参数,所以现在为时已晚。

我能想到的最好的解决方案是将tr元素移动到RowTemplate中,如下所示:

<tbody>
    @foreach (var item in Items)
    {
        @RowTemplate(item)
    }
</tbody>

<RowTemplate>
   <tr @onclick="@(() => 
            nav.NavigateTo($"dossiers/{context.Id}/basisgegevens"))">
        <td>@context.Id</td>
        <td>@context.Name</td>
        <td>@context.LegalEntityType.Name</td>
        <td>@context.Ondernemingsnummer</td>
   </tr> 
</RowTemplate>

这应该有效。恐怕没有办法将通用对象转换为其基础类型。我将进行调查,并在这里报告我的发现。

答案 1 :(得分:0)

我已经使用反射功能成功获得了Id的值:

@typeparam TItem
@inject NavigationManager nav

<table class="table">
    <thead>
        <tr>@TableHeader</tr>
    </thead>
    <tbody>
        @foreach (var item in Items)
        {
            <tr @onclick="@(() => nav.NavigateTo($"dossiers/{item.GetType().GetProperty("Id").GetValue(item, null)}/basisgegevens"))">
                @RowTemplate(item)
            </tr>
        }
    </tbody>
    <tfoot>
        <tr>@TableFooter</tr>
    </tfoot>
</table>

@code {
    [Parameter] public List<TItem> Items { get; set; }
    [Parameter] public RenderFragment TableHeader { get; set; }
    [Parameter] public RenderFragment<TItem> RowTemplate { get; set; }
    [Parameter] public RenderFragment TableFooter { get; set; }
}