Antd 表格數據分頁展示

分頁組件代碼

render(){
    const {total,size,currenPage} = this.state  // 參數分別為數據總條數、每頁數據條數、當前頁頁碼
    return (
         // 渲染分頁組件
         <Pagination size="small" total={total} 
          showTotal= {this.showTotal} defaultPageSize={size}                
          onChange={(page)=>this.pageChange(page)}     
          current={currenPage} />
    ) 
}

用到的回調函數

showTotal=(total)=> {
   return `共 ${total} 條`;
}
// 點擊上、下頁時，觸發此函數
pageChange =(val)=>{
   // 每頁數據條數
  const {size} = this.state
  console.log('+++++page',val)
  this.setState({
    // 設置當前頁
    currenPage:val
  })
  // 數據初始化函數，向后台請求數據
  this.init(val,size)
}