No way to show aggregation statistics data in table

Version

2.9.1

Environment

browser

Reproduction link

http://none

Steps to reproduce

I wanna to show aggregation statistics at Table footer, I am tryings following ways:

1. using footer prop, add tr and td to it

      <Table
        dataSource={dataSource}
        footer={() => {
          return (
            <tr className='ant-table-row  ant-table-row-level-0'>
              <td>总计</td>
              <td>总计</td>
            <td>总计</td>
            </tr>
          )
        }}
      />

1. add extra data in dataSource prop

dataSource.push({id: '总计', price: '3000'})

What is expected?

A picture is worth a thousand words:

What is actually happening?

1. using footer prop, But the footer prop is not fit the table tbody.

2. add extra data in dataSource prop, But if the dataSource length is over the pageSize , the extra data will be ignored.

[yesmeck]

Hello @TangMonk, it seems that you are requesting a feature than reporting a bug, I’m afraid we don’t have plan to implement this feature. You can disable table’s default pagination and implement pagination by yourself.

[yesmeck]

After thinking a while for the tfoot API, I’d like to add it to column property:

const columns = [{
  title: 'Age',
  dataIndex: 'age',
  key: 'age',
  footer: (data) => {
    return <div>Summary: {data.reduce((sum, record) => sum + record.age, 0)}</div>
  },
}, {
  title: 'Name',
  dataIndex: 'name',
  key: 'name',
}, {
  title: 'Address',
  dataIndex: 'address',
  key: 'address',
}];

renders