react-everafter

!npm

Introduction

This package aims to make pagination generation easier to customize.

Installation

npm i react-everafter -S

Components

$3

- items: Array. Items to be paginated, preferably objects.
- wrapper: React.Component. Container for items. Should use attributes of objects in items.
- perPage: Number. Number of items per page.
- useListElement: Boolean. True if items are to be put in ul list items. Value defaults to false.
- activeTabColor: String. CSS background-color value of tabs when active.
- truncate: Boolean. Value defaults to false.
- maxPageTabs: Number. Maximum number of page tabs to display. Defaults to 5.
- maxPages: Number. Maximum number of pages to render. Defaults to null.

$3

Paginated Table. Properties are the same as those of EverAfter.Paginator, except useListElement. Additional properties are listed.
- columns: Array. Must contain objects with keys headerText and display. headerText dictates the text in the column header. display is a Function that takes item as sole parameter. Dictates how the item is rendered in the column.
- enumerate: Boolean. Numbers items if set to true. Defaults to false.

Example Usage

``Javascript
import React, { Component } from 'react';
import EverAfter from 'react-everafter';

var items = [{n: 1}, {n: 2}, {n: 3}, {n: 4}, {n: 5}];

class MyItemContainer extends Component {
render() {
return

{this.prop.item.n}

}
}

class MyList extends Component {
render() {
return
}
}
``