Bootstrap preset for react-pagify
This preset allows you to integrate react-pagify with Bootstrap 3.
Play with it on the demo page.
Installation
npm install --save react-pagify react-pagify-preset-bootstrap
Usage
;;; ... <PaginatorContext ...pagifyBootstrapPreset segments= onSelect= { event; ; }> <PaginatorButton page=page - 1>Previous</PaginatorButton> <PaginatorSegment field="beginPages" /> <PaginatorEllipsis previousField="beginPages" nextField="previousPages" /> <PaginatorSegment field="previousPages" /> <PaginatorSegment field="centerPage" className="active" /> <PaginatorSegment field="nextPages" /> <PaginatorEllipsis previousField="nextPages" nextField="endPages" /> <PaginatorSegment field="endPages" /> <PaginatorButton page=page + 1>Next</PaginatorButton></PaginatorContext>
Note that you need to use active
class for the centerPage
segment.
Also note that you can use any library for pagination logic, segmentize is recommended but not required.
See react-pagify documentation for all available options.
Changelog
The changelog can be found on the Releases page.
Author
Demo page is based on the original react-pagify
demo.
License
The MIT License, see the included License.md file.