Compartilhamento de tecnologia

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

Etapas de implementação

1. Especifique o atributo de paginação para o componente Tabela para exibir o efeito de paginação
2. Obtenha os dados selecionados no formulário de filtro no evento de troca de paginação
3. Usar os dados da página atual para modificar a dependência do parâmetro params faz com que a interface seja chamada novamente para obter os dados mais recentes.

const pageChange = (page) => {
    // 拿到当前页参数 修改params 引起接口更新
    setParams({
      ...params,
      page
    })
}

return (
   <Table rowKey="id" columns={columns} dataSource={article.list} pagination={{
      current: params.page,
      pageSize: params.per_page,
      onChange: pageChange,
      total: article.count
    }} />
)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

Propriedades relacionadas