@quentinm22/cmp-pagination-react

PACKAGE

Installation

Install Package in React project

 npm i @quentinm22/cmp-pagination-react

 or

  yarn @quentinm22/cmp-pagination-react

Update

  npm i @quentinm22/cmp-pagination-react@latest

  or

  yarn add @quentinm22/cmp-pagination-react@latest

Usage/Examples

import React, { useState } from 'react'
import {Pagination} from '@quentinm22/cmp-pagination-react'

const App = () => {
  const arrElements = [1,2,3,4,5,6,7,8,9,10,11,12,13]
  const [currentPage, setCurrentPage] = useState(1);
  const [elementsPerPage, setElementsPerPage] = useState(3);
  const indexLastItem = currentPage * elementsPerPage;
  const indexFirstItem = indexLastItem - elementsPerPage;
  const currentItems = arrElements.slice(indexFirstItem, indexLastItem);
  return(
    {currentItems.map(e => 
                <p>{e}</p>
            )}
          
            <Pagination
            currentPage={currentPage}
            setCurrentPage={setCurrentPage} 
            limit={arrElements.length}
            elementsPerPage={elementsPerPage}
            colorPrimary={'#3e3934'}
            colorFont={"white"}
            />
  )
}

Props	Value
currentPage	number => localState
setCurentPage	function => localState
limit	number => array.length
elementPerPage	number
colorPrimary	string
colorFont	string

Authors

• @quentinM22