Skip to content

react-component/pagination

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Jan 2, 2022
04b57e6 · Jan 2, 2022
Nov 16, 2021
Jul 24, 2020
Nov 24, 2021
Nov 24, 2021
Nov 24, 2021
Jul 12, 2020
May 29, 2020
Mar 6, 2021
Feb 27, 2020
Feb 27, 2020
Feb 12, 2020
Mar 6, 2021
Mar 6, 2021
Dec 21, 2016
Mar 15, 2021
Feb 27, 2020
Mar 6, 2021
Jan 2, 2022
Jan 2, 2022
Mar 6, 2021

Repository files navigation

rc-pagination

React Pagination Component.

NPM version dumi build status Test coverage codecov Dependencies DevDependencies npm download

Development

npm install
npm start

Example

http://localhost:9001

online example: https://pagination-react-component.vercel.app

Install

rc-pagination

Usage

import Pagination from 'rc-pagination';

ReactDOM.render(<Pagination />, container);

API

Parameter Description Type Default
disabled disable pagination Bool -
defaultCurrent uncontrolled current page Number 1
current current page Number undefined
total items total count Number 0
defaultPageSize default items per page Number 10
pageSize items per page Number 10
onChange page change callback Function(current, pageSize) -
showSizeChanger show pageSize changer Bool false when total less then totalBoundaryShowSizeChanger, true when otherwise
totalBoundaryShowSizeChanger when total larger than it, showSizeChanger will be true number 50
pageSizeOptions specify the sizeChanger selections Array ['10', '20', '50', '100']
onShowSizeChange pageSize change callback Function(current, size) -
hideOnSinglePage hide on single page Bool false
showPrevNextJumpers show jump-prev, jump-next Bool true
showQuickJumper show quick goto jumper Bool / Object false / {goButton: true}
showTotal show total records and range Function(total, [from, to]) -
className className of pagination String -
simple when set, show simple pager Object null
locale to set l10n config Object zh_CN
style the style of pagination Object {}
showLessItems show less page items Bool false
showTitle show page items title Bool true
itemRender custom page item renderer Function(current, type: 'page' | 'prev' | 'next' | 'jump-prev' | 'jump-next', element): React.ReactNode | (current, type, element) => element
prevIcon specifict the default previous icon ReactNode | (props: PaginationProps) => ReactNode
nextIcon specifict the default previous icon ReactNode | (props: PaginationProps) => ReactNode
jumpPrevIcon specifict the default previous icon ReactNode | (props: PaginationProps) => ReactNode
jumpNextIcon specifict the default previous icon ReactNode | (props: PaginationProps) => ReactNode

License

rc-pagination is released under the MIT license.