Alexey87
Advanced Member | Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору import classNames from 'classnames' import querystring from 'querystring' import { Link } from 'react-router' class PaginationItem extends React.Component{ constructor(props){ super(props); } getLink(index){ let path = this.context.location['pathname'], qs_original = Object.assign({}, this.context.location['query']), qs_new = Object.assign(qs_original, {page: index}), qs = querystring.stringify(qs_new); return `${path}?${qs}`; } render(){ let path = this.context.location['pathname'], qs_original = Object.assign({}, this.context.location['query']), qs_new = Object.assign(qs_original, {page: this.props.index}); return( <li className={classNames( 'page-item', {'active': this.props.active} )}> <Link to={path} query={qs_new}> {this.props.index} </Link> </li> ); } } PaginationItem.contextTypes = { location: React.PropTypes.object.isRequired, history: React.PropTypes.object.isRequired }; class Pagination extends React.Component { constructor(props){ super(props); } render(){ if(this.props.numPages > 1) { let items = [], startPageIndex = this.props.currentPage - this.props.pagesAround, endPageIndex = this.props.currentPage + this.props.pagesAround; if(startPageIndex < 1) startPageIndex = 1; if(endPageIndex > this.props.numPages) endPageIndex = this.props.numPages; for(let i=startPageIndex; i<=endPageIndex; i++) { items.push( <PaginationItem key={i} index={i} active={i === this.props.currentPage} /> ); } return ( <ul className="pagination"> {items} </ul> ); } else { return false } } } Pagination.propTypes = { numPages: React.PropTypes.number.isRequired, currentPage: React.PropTypes.number, pagesAround: React.PropTypes.number }; Pagination.defaultProps = { currentPage: 1, pagesAround: 2 }; export default Pagination | Всего записей: 655 | Зарегистр. 27-01-2008 | Отправлено: 12:08 10-01-2016 | Исправлено: Alexey87, 12:13 10-01-2016 |
|