react-pagination-js v2.0.0

react-pagination-js

Simple and light weight pagination for react. This library is updated version of react-pagination-library. It comes with five themes and are easy to customize. 1. default 2. dark 3. bootstrap 4. border-bottom 5. circle

Demo

click here for live demo.

Installation

$ npm install react-pagination-js

Usage

import React from "react";
import Pagination from "react-pagination-js";
import "react-pagination-js/dist/styles.css"; // import css

class App extends React.Component {
  state = {
    currentPage: 1
  };
  changeCurrentPage = numPage => {
    this.setState({ currentPage: numPage });
    //fetch a data
    //or update a query to get data
  };
  render() {
    return (
      <div>
        <Pagination
          currentPage={this.state.currentPage}
          totalPages={10}
          changeCurrentPage={this.changeCurrentPage}
        />
        <h2>current Page:{this.state.currentPage}</h2>
      </div>
    );
  }
}
export default App;

Props