AZaviruha / Pager
Licence: mit
*DEPRECATED* React <Pager> component (stateless).
Stars: ✭ 75
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to 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
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
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
DEPRECATED Stateless Pager component
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*
* 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
- Fixed #12
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].