react-pitu v1.2.0

React Pagination

Installation

$ yarn add react-pitu

import React, { Component } from 'react'
import Pagination from 'react-pitu';
import 'react-pitu/build/assets/styles/styles.css';

class UserComponent extends Component {
    constructor(props) {
        super(props);

        this.state = {
            perPage: 10,
            totalItemCount: 0
        };

        this.handlePaginationChange = this.handlePaginationChange.bind(this);
    }

    componentDidUpdate(prevProps) {
        if (prevProps.totalCount !== this.props.totalCount) {
            this.setState({ totalItemCount: <TOTAL_ITEM_COUNT> });
        }
    }

    handlePaginationChange(data) {
        const { cursor, itemsPerPage } = data;

        // make a next http request...
    }

    render() {
        const { perPage, totalItemCount } = this.state;

        return(
            <Pagination
                perPage={perPage}
                total={totalItemCount}
                onPropertyChange={this.handlePaginationChange}
            />
        );
    }
}

export default UserComponent;

Preview (1.1.x)

Preview (1.2.x)

Props

navImages