
Table 合计功能
用于数据统计
数据统计示例
设置 ShowFooter=true
显示 Footer
自定义合计功能
Demo
Table
组件有 TableFooter
模板,其数据上下文为 Table
组件的数据集合 IEnumerable<TItem>
TableFooter
模板中关联的上下文 context
值为当页数据
TableFooter
模板内可以自定义单元格 td
内容,也可以使用内置的 TableFooterCell
组件进行数据显示
@page "/tables/footer"
<h3>Table 合计功能</h3>
<h4>用于数据统计</h4>
<Block Title="数据统计示例" Introduction="设置 <code>ShowFooter=true</code> 显示 <code>Footer</code> 自定义合计功能">
<p><code>Table</code> 组件有 <code>TableFooter</code> 模板,其数据上下文为 <code>Table</code> 组件的数据集合 <code>IEnumerable<TItem></code></p>
<p><code>TableFooter</code> 模板中关联的上下文 <code>context</code> 值为当页数据</p>
<p><code>TableFooter</code> 模板内可以自定义单元格 <code>td</code> 内容,也可以使用内置的 <code>TableFooterCell</code> 组件进行数据显示</p>
<Table TItem="Foo" ShowFooter="true" class="footer-demo"
IsPagination="true" PageItemsSource="@PageItemsSource" OnQueryAsync="@OnQueryAsync">
<TableColumns>
<TableColumn @bind-Field="@context.DateTime" Width="180" />
<TableColumn @bind-Field="@context.Name" />
<TableColumn @bind-Field="@context.Address" />
<TableColumn @bind-Field="@context.Count" />
</TableColumns>
<TableFooter>
<TableFooterCell colspan="3" Text="合计:" />
<TableFooterCell Text="@context.Sum(i => i.Count).ToString()" />
</TableFooter>
</Table>
</Block>
网络错误