Javascript 如何在顶部antd表中添加摘要?

Javascript 如何在顶部antd表中添加摘要?,javascript,reactjs,html-table,antd,Javascript,Reactjs,Html Table,Antd,我可以在表的末尾添加摘要行。但我需要在顶部添加它。我怎样才能在家里做到这一点 { 让totalWaste=0; 设totalBrick=0; pageData.forEach(({waste,brick})=>{ 总废物+=废物; totalBrick+=砖; }); 返回( 总结 {totalWaste} {totalBrick} ); }} /> 摘要:正在tfoot中添加,并且没有这样的选项可以将摘要作为第一行 因此,我们不必使用摘要,而是可以进行相同的计算,并在第一个位置添加一个对象,以

我可以在表的末尾添加摘要行。但我需要在顶部添加它。我怎样才能在家里做到这一点

{
让totalWaste=0;
设totalBrick=0;
pageData.forEach(({waste,brick})=>{
总废物+=废物;
totalBrick+=砖;
});
返回(
总结
{totalWaste}
{totalBrick}
);
}}
/>

摘要
:正在
tfoot
中添加,并且没有这样的选项可以将
摘要
作为第一行

因此,我们不必使用
摘要
,而是可以进行相同的计算,并在第一个位置添加一个
对象
,以拥有原始数据

工作演示


黑客入侵:在标题子项中设置值以解决排序问题


这方面没有道具,请使用CSS进行处理您是否愿意尝试使用
组件
属性用您自己的实现覆盖标题渲染器?@FatemehQasemkhani您能告诉我吗pls@Kyr你能在标题前或第一行给我看一下吗?问题是当我排序时,它会一直排到底部again@Profer,已经添加了另一个演示,请查看that@Profer,很高兴知道,这很有帮助。:)嗨,如果你能回答这个问题
<Table
              columns={columns}
              dataSource={data}
              summary={pageData => {
                let totalWaste = 0;
                let totalBrick = 0;

                pageData.forEach(({ waste, brick }) => {
                  totalWaste += waste;
                  totalBrick += brick;
                });

                return (
                  <>
                    <thead>
                      <tr className="ant-table-row  ant-table-row-level-0">
                        <th>Summary</th>
                        <th></th>
                        <th></th>
                        <th>{totalWaste}</th>
                        <th>{totalBrick}</th>
                      </tr>
                    </thead>
                  </>
                );
              }}
            />