Как установить серийный номер в таблице Antd для каждой строки при использовании нумерации страниц

Question

Я использую Antd Table в моем проекте js. У меня есть таблица с нумерацией страниц до 10 записей на странице. моя проблема в том, что когда я нажимаю на вторую страницу, я вижу, что серийный номер начинается снова с 1 вместо 11. его не в порядке. вот мой код.

компонент

function createColumns(view, edit, remove, activate) {
 return [
{
  title: 'S NO',
  key: 'sno',
  width: '20px',
  render: (text, object, index) =>return  index + 1

},
...
...

}
 <TableWrapper
          rowKey={obj => obj.id}
          pagination={{ pageSize: 10 }}
          columns={this.columns}
          locale={{ emptyText: 'No data found' }}
          dataSource={data}              
        />

Я пробовал решения, приведенные в комментарии к этой проблеме github , но это не так т работа. что мне здесь не хватает?

Answer 1

Указанное здесь поле index относится к отображаемым в данный момент данным, поэтому оно всегда будет начинаться с 0 на новой странице. Чтобы импровизировать и соответствовать вашей ситуации, вы можете сохранить номер текущей страницы и использовать его для изменения index

const [page, setPage] = React.useState(1);
return (
  <Table
    dataSource={data}
    pagination={{
      onChange(current) {
        setPage(current);
      }
    }}
  >
    <Column
      title="Index"
      key="index"
      render={(value, item, index) => (page - 1) * 10 + index}
    />
    ...
  </Table>
)