antd table分页如何添加from ... to ...元数据

Question

这是与我想要做的相似的示例图片

Answer 1

终于找到解决方法

const getTableMeta = (current, pageSize, total) => {
      let from = (current - 1) * pageSize + 1;
      let to = (current - 1) * pageSize + pageSize
    
      if (to > total) {
        to = total;
      }
    
      return (`${from} - ${to} / ${total}`)
    }

current,pageSize,total参数可以使用antd轻松取table分页api.

Answer 2

当您可以使用 showTotal 道具时，不确定为什么选择自定义解决方案：

<Table
  columns={columns}
  dataSource={data}
  pagination={{
    showTotal: (total, range) => `${range[0]} - ${range[1]} / ${total}`,
    pageSize: 10
  }}
  ...
/>

DEMO

antd table分页如何添加from ... to ...元数据

How to add from ... to ... meta data to antd table pagination

reactjs

antd