Pagination React Hooks

Pagination component prepared with React hooks. Load and use.

My first component as an open source after learning React. If you want to contribute, I am waiting for you in the issue section.

Installation

Install pagination-react-hooks with npm:

npm i pagination-react-hooks

with yarn:

yarn add pagination-react-hooks

Example

To be practical you can see live in my react application https://practical-react.herokuapp.com.

Usage

Add the component to the section you want to show and remember to use the parameters. That's all.

import React from 'react';
import Pagination from 'pagination-react-hooks';

const Content = () => {

    const posts = [
        {id : "1", name: "Berat 1"},
        {id : "2", name: "Berat 2"},
        {id : "3", name: "Berat 3"},
        {id : "4", name: "Berat 4"},
        {id : "5", name: "Berat 5"},
        {id : "6", name: "Berat 6"},
    ]
    
    const show = (value) => (
        <li key={value.id} className="card">
            <span>{value.name}</span>         
        </li>
    )
    return (
        <Pagination
            data={posts}
            Show={show}
            displayNumber="7"
            previousText="Önceki"
            nextText="Sonraki"
        />
    )
}
export default Content;

Params

| Parameters | Description
|------------------|------------------------------------| | posts | The array of content to display. | | Show | The theme you want to sho your content | | displayNumber | The maximum number of content to display on the page. | | previousText | Previous button text | | nextText | Next button text |