sly-rc-paginator v0.0.12

Installation

$ npm install sly-rc-paginator --save

This paginator component assumes that you have styles for a paginator with the following structure

<ul>
    <li>
	    <a></a>
    </li>
</ul>

Also the paginator truncates the list pages to just 10.

Usage

import  React, {  Component  }  from  "react";

import  Paginator  from  "sly-rc-paginator";

class  App  extends  Component  {

    constructor()  {
	    super();
	    this.state  =  {
			meta:  { // demo meta data from API
			    totalItems:  100,
			    currentPage:  1,
				itemsPerPage:  5
			}
		};
	}
    onPageChange(currentPage)  {
	  this.setState(prevSate => {
	    return {
		  posts: json, // do stuff with json
		     meta: { // update meta data
					...prevSate.meta,
					currentPage
				}
	    };
	  });
    }
    render()  {
	    const  pagintorOptions  =  {
		    ulClassName:  "pagination",
		    liClassName:  "page-item",
		    activeClassName:  "active",
		    disabledClassName:  "disabled"
	    };
    return  (
	    <div  className="App">
		    {/*Show posts*/}
		    <Paginator
			    meta={this.state.meta}
			    options={pagintorOptions}
			    onPageChange={this.onPageChange.bind(this)}
		    />
	    </div>
	   );
    }
}
export  default  App;

Props