ant-design-blazor/components/list/AntList.razor
James Yeung 914421651b feat(module: list): add OnItemClick event callback for list items (#489)
* feat(module: list): add event callback for list items

* docs: add onitemclick in doc
2020-08-10 23:58:17 +08:00

96 lines
2.9 KiB
C#

@namespace AntDesign
@inherits AntDomComponentBase
@typeparam TItem
<div class="@ClassMapper.Class" style="@Style" Id="@Id">
@if (Header != null)
{
<div class="@PrefixName-header">
@Header
</div>
}
@if (DataSource != null && DataSource.Any())
{
<Spin Spinning="Loading">
@childrenContent(this)
</Spin>
}
else
{
<div style="min-height:53px" />
}
@if (Footer != null)
{
<div class="@PrefixName-footer">
@Footer
</div>
}
@if (LoadMore != null)
{
@LoadMore
}
</div>
@code{
RenderFragment<AntList<TItem>> childrenContent = content =>
@<Template>
@if (content.Grid != null)
{
<Row Gutter="content.Grid.Gutter">
@foreach (var item in content.DataSource)
{
var callback = CallbackFactory.Create(content, () => content.HandleItemClick(item));
<CascadingValue Value="callback" Name="ItemClickCallback">
@if (content.Extra != null)
{
<AntListItem ItemCount="content.DataSource.Count()" ItemLayout="content.ItemLayout" Grid="content.Grid" Actions="content.Actions" Extra="content.Extra">
@content.Item(item)
</AntListItem>
}
else
{
<AntListItem ItemCount="content.DataSource.Count()" ItemLayout="content.ItemLayout" Grid="content.Grid" Actions="content.Actions">
@content.Item(item)
</AntListItem>
}
</CascadingValue>
}
</Row>
}
else
{
<ul class="ant-list-items">
@foreach (var item in content.DataSource)
{
var callback = CallbackFactory.Create(content, () => content.HandleItemClick(item));
<CascadingValue Value="callback" Name="ItemClickCallback">
@if (content.Extra != null)
{
<AntListItem ItemCount="content.DataSource.Count()" ItemLayout="content.ItemLayout" Actions="content.Actions" Extra="content.Extra">
@content.Item(item)
</AntListItem>
}
else
{
<AntListItem ItemCount="content.DataSource.Count()" ItemLayout="content.ItemLayout" Actions="content.Actions">
@content.Item(item)
</AntListItem>
}
</CascadingValue>
}
</ul>
}
</Template>;
}