All Projects → AZaviruha → Pager

AZaviruha / Pager

Licence: mit
*DEPRECATED* React <Pager> component (stateless).

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to Pager

tiny-wheels
一套基于原生JavaScript开发的组件库,无依赖、体积小、简单易用
Stars: ✭ 60 (-20%)
Mutual labels:  pager
Vgrep
vgrep - a user-friendly pager for grep
Stars: ✭ 492 (+556%)
Mutual labels:  pager
Mattext
Simple matrix-style pager
Stars: ✭ 34 (-54.67%)
Mutual labels:  pager
React Native Pager
controllable pager component for react native
Stars: ✭ 267 (+256%)
Mutual labels:  pager
React Native Gallery Toolkit
Reanimated 2 powered gallery implementation
Stars: ✭ 379 (+405.33%)
Mutual labels:  pager
X.pagedlist
Library for easily paging through any IEnumerable/IQueryable in ASP.NET/ASP.NET Core
Stars: ✭ 625 (+733.33%)
Mutual labels:  pager
Reside-Menu
By applying viewpager animation you can also make AMAZING Reside Menu's
Stars: ✭ 72 (-4%)
Mutual labels:  pager
Ov
Feature rich terminal pager
Stars: ✭ 59 (-21.33%)
Mutual labels:  pager
Swiftuipager
Native Pager in SwiftUI
Stars: ✭ 430 (+473.33%)
Mutual labels:  pager
Delta
A syntax-highlighting pager for git, diff, and grep output
Stars: ✭ 11,555 (+15306.67%)
Mutual labels:  pager
Cmpagetitleview
✍️一分钟集成类似抖音,新浪微博,腾讯视频,网易新闻,今日头条等常见的标题栏样式,api灵活易扩展,支持Cocoapods和Masonry布局,支持ChildController的完整生命周期
Stars: ✭ 270 (+260%)
Mutual labels:  pager
Jxpagelistview
高仿闲鱼、转转、京东、中央天气预报等主流APP列表底部分页滚动视图
Stars: ✭ 377 (+402.67%)
Mutual labels:  pager
Liquidswipe
Android LiquidSwipe Library
Stars: ✭ 721 (+861.33%)
Mutual labels:  pager
Transformerslayout
🔥 App金刚区导航菜单,类似淘宝、QQ音乐等APP导航,方格布局横向多行滑动翻页带滚动条
Stars: ✭ 258 (+244%)
Mutual labels:  pager
Tty Pager
Terminal output paging - cross-platform, major ruby interpreters
Stars: ✭ 37 (-50.67%)
Mutual labels:  pager
security-study-tutorial
Summary of online learning materials
Stars: ✭ 73 (-2.67%)
Mutual labels:  pager
Axphotoviewer
An iOS/tvOS photo gallery viewer, useful for viewing a large (or small!) number of photos.
Stars: ✭ 544 (+625.33%)
Mutual labels:  pager
Dotnetpaging
Data paging with ASP.NET and ASP.NET Core
Stars: ✭ 70 (-6.67%)
Mutual labels:  pager
Concentriconboarding
Android Concentric Onboarding library
Stars: ✭ 42 (-44%)
Mutual labels:  pager
Gridiron
Feature-Packed React Grid Framework
Stars: ✭ 8 (-89.33%)
Mutual labels:  pager

DEPRECATED Stateless Pager component

Code Climate Build Status
NPM version

Deprecation notice

Now all my free time is spent on react-ui-generator, which is my main project. So, I don't have any more time to maintain this package. Please, fill free to fork this repository.

Getting started

import React from 'react';
import { render } from 'react-dom';
import Pager from 'react-pager';

class App extends React.Component {
	constructor(props) {
		super(props);

		this.handlePageChanged = this.handlePageChanged.bind(this);

		this.state = {
			total:       11,
			current:     7,
			visiblePage: 3,
		};
	}

	handlePageChanged(newPage) {
		this.setState({ current : newPage });
	}

	render() {
		return (
			<Pager
				total={this.state.total}
				current={this.state.current}
				visiblePages={this.state.visiblePage}
				titles={{ first: '<|', last: '>|' }}
				className="pagination-sm pull-right"
				onPageChanged={this.handlePageChanged}
			/>
		);
	}
}

window.onload = () => {
	render(React.createElement(App), document.querySelector('#app'));
};

What it looks like*

First | Prev | ... | 6 | 7 | 8 | 9 | ... | Next | Last

* Bootstrap 3.0 is required by default, but you can replace it with your own css.

Demo

Just open demo/index.html in your browser. Or see interactive demo here.

Tests

npm test

Changelog

v1.3.0

  • @kallaspriit fixed #16
  • Updates devDependencies
  • Move building procedure to Docker

v1.2.1

v1.2.0

  • Rewrited all to ES6.
  • Switched from gulp + browserify to webpack.
  • Now officially supports only React >= 15.0.0

v1.1.4

  • Updated to React 15. Thanks to contributors!

v1.1.1

  • Updated to React 0.13.
  • Updated local demo.

v1.1.0

  • Added titles property. See demo.
  • Improved building script.

v1.0.6

  • Fixed <li class="undefined" .. in "more" and "less" buttons.
  • Added a few unit-tests.

Contributors

See contributors.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].