Pagination - Paginator component
Effect demonstration
1. Conventional pager
<Pagination
total={66}
onChange={e => {
Alert.alert(e + '');
}}
/>

2. Manually set page
<Pagination
page={3}
total={66}
onChange={e => {
Alert.alert(e + '');
}}
/>

3. Custom button
<Pagination
total={66}
onChange={e => {
Alert.alert(e + '');
}}
prevButtonRender={isFirstPage => {
return isFirstPage ? <Text>isFirstPage</Text> : <Text>notFirstPage</Text>;
}}
nextButtonRender={isLastPage => {
return isLastPage ? <Text>LastPage</Text> : <Text>notLastPage</Text>;
}}
counterRender={(currentindex, totalPages) => {
return <Text>{currentindex + '/' + totalPages}</Text>;
}}
/>

API
| Properties | Required | Description | Type | Default Value |
|---|---|---|---|---|
| page | false | Current page number | number | 1 |
| total | false | total quantity | number | |
| pageSize | false | Number of pages | number | 10 |
| onChange | false | Page change event | (page: number) => void | |
| prevButtonText | false | Previous page button text | string | Previous page |
| nextButtonText | false | Next page button text | string | Next page |
| prevButtonRender | false | Customize the previous page button | (isFirstPage: boolean) => ReactElement | |
| nextButtonRender | false | Customized next page button | (isLastPage: boolean) => ReactElement | |
| counterRender | false | Custom counter | (current: number, totalpages: number) => ReactElement | |
| activeOpacity | false | The opacity of the previous/next page when pressed | number | 0.6 |