@kevinwang0316/react-materialui-pagination v1.1.4

React-materialui-pigination

A simple react component with Material-UI for pagination

Installing

npm install --save @kevinwang0316/react-materialui-pagination

Dependencies requirement

Due to this library is using React and Material-ui, some libraries are required. Usually, the project needs this component has already installed these libraries. Please check your package.json file.

• @material-ui/core
• react
• prop-types

Usage

import Pagination from '@kevinwang0316/react-materialui-pagination';

// In your component
<Pagination
  offset={startOffsetNumber}
  limit={limitationForEachPage}
  total={totalNumber}
  onClick={onClickCallBackFunction}
/>

A mini example

import React from 'react';
import ReactDOM from 'react-dom';
import MuiThemeProvider from '@material-ui/core/styles/MuiThemeProvider';
import Pagination from '@kevinwang0316/react-materialui-pagination';
 
class PaginationExample extends React.Component {
  
  handleClick = offset => {
    // Do your data loading or whatever you want here with the offset.
  };
 
  render() {
    return (
      <MuiThemeProvider>
        <Pagination
          offset={0}
          limit={10}
          total={100}
          onClick={this.handleClick}
        />
      </MuiThemeProvider>
    );
  }
}
 
ReactDOM.render(
  <PaginationExample/>,
  document.getElementById('app')
);

Props explaination

License

React-materialui-pagination is licensed under MIT License - see the License file.