首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >MudBlazor -泛型MudTable

MudBlazor -泛型MudTable
EN

Stack Overflow用户
提问于 2021-12-09 17:14:34
回答 1查看 835关注 0票数 1

我正在尝试创建自己的自定义组件,该组件继承自MudTable。在我的自定义组件中,我创建了一个具有IEnumerable类型的TItem属性,然后从父类发送一个DataSource,并通过参数定义TItem类型。我遇到的问题是,MudTable使用@context从DataSource中获取值,当您使用预定义的类型给DataSource时,这个值是已知的。你可以在这里看到MudTable

但是,当DataSource是泛型类型时,@context不知道从哪个属性中获取值,如何做到这一点。

父组件,它包括自定义组件:

代码语言:javascript
复制
<CETable DataSource="Persons" ItemType="Person"></CETable>

public List<Person> Persons { get; set; }

protected override void OnInitialized()
{
    Persons = new List<Person>();
    Persons.Add(new Person { AgeOfPerson = "25", Name = "Mike" });
    Persons.Add(new Person { AgeOfPerson = "35", Name = "John" });
    Persons.Add(new Person { AgeOfPerson = "45", Name = "Michel" });

}

public class Person
{
    public string Name { get; set; }
    public string AgeOfPerson { get; set; }

}

自定义组件(CETable):

代码语言:javascript
复制
@typeparam ItemType
@inherits MudTable<ItemType>
<MudTable Items="DataSource">
<HeaderContent>
 @*I will send later those columns as a parameter*@

    <MudTh>Name</MudTh>
    <MudTh>AgeOfPerson</MudTh>

</HeaderContent>
<RowTemplate>
    <MudTd DataLabel="Name">@context.</MudTd> // How To define the context here ?
    <MudTd DataLabel="AgeOfPerson">@context.</MudTd> // How To define the context here ?
</RowTemplate>
</MudTable>
@code{
[Parameter]
public IEnumerable<ItemType> DataSource { get; set; }
}

谢谢你的帮助。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2021-12-11 13:20:05

我找到了解决办法。我会把它贴在这里以防有人需要它。基本上,我正在创建一个呈现片段,它从父组件获取内容并在子组件中设置值。

父组件,它包括自定义组件:

代码语言:javascript
复制
<CETable DataSource="Persons" ItemType="Person">
<CEHeaderTemplate>
    <CETh>Name</CETh>
    <CETh>AgeOfPerson</CETh>
</CEHeaderTemplate>
<CERowTemplate>
    <CETd DataLabel="Name">@context.Name</CETd>
    <CETd DataLabel="AgeOfPerson">@context.AgeOfPerson</CETd>
</CERowTemplate></CETable>

自定义组件(CETable):

代码语言:javascript
复制
@typeparam ItemType
@inherits MudTable<ItemType>
<MudTable Items="DataSource">
<HeaderContent>
    @CEHeaderTemplate
</HeaderContent>
<RowTemplate>
    @CERowTemplate(@context)
</RowTemplate></MudTable>

@code{
[Parameter]
public IEnumerable<ItemType> DataSource { get; set; }

[Parameter]
public RenderFragment<ItemType> CERowTemplate { get; set; }

[Parameter]
public RenderFragment CEHeaderTemplate { get; set; }
}
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/70294001

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档