1.0.5 • Published 8 years ago

react-paginate-ie8 v1.0.5

Weekly downloads
4
License
MIT
Repository
github
Last release
8 years ago

react-paginate

Build Status

A ReactJS component to render a pagination.

By installing this component and writing only a little bit of CSS you can obtain this:

or

Installation

Install react-paginate with npm:

$ npm install react-paginate

For CommonJS users:

import ReactPaginate from 'react-paginate';

Read the code of demo/js/demo.js. You will quickly understand how to make react-paginate work with a list of objects.

Demo

Clone the repository and move into:

$ git clone git@github.com:AdeleD/react-paginate.git
$ cd react-paginate

Install dependencies:

$ make install

Prepare the demo:

$ make demo

Run the server:

$ make serve

Open your browser and go to http://localhost:3000/.

Props

NameTypeDescription
pageNumNumberRequired. The total number of pages.
pageRangeDisplayedNumberRequired. The range of pages displayed.
marginPagesDisplayedNumberRequired. The number of pages to display for margins.
previousLabelNodeLabel for the previous button.
nextLabelNodeLabel for the next button.
breakLabelNodeLabel for ellipsis.
clickCallbackFunctionThe method to call when a page is clicked.
initialSelectedNumberThe initial page selected.
forceSelectedNumberTo override selected page with parent prop.
containerClassNameStringThe classname of the pagination container.
pageClassNameStringThe classname on tag li of each page element.
pageLinkClassNameStringThe classname on tag a of each page element.
activeClassNameStringThe classname for the active page.
previousClassNameStringThe classname on tag li of the previous button.
nextClassNameStringThe classname on tag li of the next button.
previousLinkClassNameStringThe classname on tag a of the previous button.
nextLinkClassNameStringThe classname on tag a of the next button.
disabledClassNameStringThe classname for disabled previous and next buttons.

Contribute

  1. Submit an issue
  2. Fork the repository
  3. Create a dedicated branch (never ever work in master)
  4. The first time, run command: webpack into the directory
  5. Run npm start
  6. Fix bugs or implement features
  7. Always write tests

Run tests:

$ make test