Nutritious Pumpkin Meal

    @trendmicro/react-paginations

    0.6.1 • Public • Published

    react-paginations build status Coverage Status

    NPM

    React Paginations

    Demo: https://trendmicro-frontend.github.io/react-paginations

    Installation

    1. Install the latest version of react and react-paginations:
    npm install --save react @trendmicro/react-paginations
    
    1. At this point you can import @trendmicro/react-paginations and its styles in your application as follows:
    import { TablePagination } from '@trendmicro/react-paginations';
    
    // Be sure to include styles at some point, probably during your bootstraping
    import '@trendmicro/react-paginations/dist/react-paginations.css';

    Usage

    TablePagination

    <TablePagination
        type="full"
        page={this.state.page}
        pageLength={this.state.pageLength}
        totalRecords={this.state.totalRecords}
        onPageChange={({ page, pageLength }) => {
            this.setState({ page, pageLength })
        }}
        prevPageRenderer={() => <i className="fa fa-angle-left" />}
        nextPageRenderer={() => <i className="fa fa-angle-right" />}
    />

    API

    Properties

    TablePagination

    Name Type Default Description
    type String 'full' 'full', 'reduced', or 'minor'
    page Number 1
    pageLength Number 10
    pageLengthMenu Array [10, 25, 50, 100]
    dropup Boolean false The menu will open above the dropdown toggle, instead of below it.
    totalRecords Number 0
    onPageChange Function
    prevPageRenderer Function
    nextPageRenderer Function
    pageRecordsRenderer Function({ totalRecords, from, to })
    pageLengthRenderer Function({ pageLength })

    License

    MIT

    Install

    npm i @trendmicro/react-paginations

    DownloadsWeekly Downloads

    557

    Version

    0.6.1

    License

    MIT

    Last publish

    Collaborators

    • trendmicro-frontend
    • cheton
    • rothpeng
    • smalltase