通過這個，對組件的之間的套用，多了一些了解。不再是單純的，復制提供的組件代碼，而是通過屬性賦值，將多個組件功能同時實現。
1.實現原理：主要應用的還是Table，通過對Table屬性pagination的設置，實現指定功能。
2.邏輯：定義pagination鍵值對，初始化相關屬性，可以在state中定義，也可以直接定義。
需要注意的是，在state中定義時，需要在state外單獨定義，current對應的變量，因為state設置變量有延遲，可能沒法及時賦值實現跳頁。（最好有個小模擬，觀察在state內外的區別）

//state外定義cur表示當前顯示頁面 var cur=1; //state內定義pagination的屬性值 indexTable:{pagination:{//每頁3條項目pageSize:3,//自定義每頁顯示數目showSizeChanger:true,onShowSizeChange:(current, pageSize)=> {console.log(current, pageSize);},//自定義每頁顯示項目的選項pageSizeOptions:['3','6','9'],// 輸入指定頁碼跳頁showQuickJumper:true,onShowQuickJump:(page)=>{// console.log('page:'+page+' cur:'+cur);cur=page;// console.log(cur);},//全部項目數（最好可以用變量表示，與實際項目數關聯）total: 100,// 點擊跳頁onChange:(page)=>{// console.log('page:'+page+' cur:'+cur);cur=page;// console.log(cur);}} }

3.布局：current沒定義在pagination鍵值對中，故要另外賦值，同時順序有要求，先賦值current，再賦值鍵值對

<Table pagination={{current:cur} pagination={state.indexTable.pagination}/>

4.效果：

參考鏈接：https://blog.csdn.net/qq_41140741/article/details/87907288

？？？？：
布局中,pagination={{current:cur}不設也沒關系？

總結

以上是生活随笔為你收集整理的ant design-Table中的分页实现（包括点击跳页，输入跳页，以及指定每页项目数）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。