react.js 翻页插件实例代码 | 您所在的位置:网站首页 › react分页组件 › react.js 翻页插件实例代码 |
var Page = React.createClass({ render:function() { //中间代码更新 var totalRows = this.props.totalRows; var listRows = this.props.listRows; var nowPage = this.props.nowPage>0?this.props.nowPage:1; var firstRow = this.props.listRows*(this.props.nowPage-1); var totalPage = Math.ceil(totalRows/listRows); var show_count=this.props.show_count?this.props.show_count:5; if((!totalPage)&&nowPage>totalPage) { this.props.nowPage=totalPage; } if(this.props.nowPage { this.props.nowPage=1; } var show_count_mid=show_count/2; var pages = []; for(var i=1;i { var page=0; if(nowPage { page = i; } elseif(nowPage+show_count_mid>totalPage) { page = totalPage - show_count+i; } else { page =nowPage-Math.ceil(show_count_mid)+i; } if(page>0&&page!=nowPage) { if(page { pages.push( onClick={this.props.onPagination.bind(this,page)}>{page}); } } else { pages.push( className="active">{page}); } } this.pagesbutton=pages; return ( this.props.totalRows>0?( className="pagination"> Total:{this.props.totalRows} {this.props.nowPage}/{Math.ceil(this.props.totalRows/this.props.listRows)} onClick={this.props.onPagination.bind(this,1)}>firstpage onClick={this.props.onPagination.bind(this,this.props.nowPage==1?1:this.props.nowPage-1)}> href="#none">« {this.pagesbutton} onClick={this.props.onPagination.bind(this,this.props.nowPage==this.props.totalPage?this.props.totalPage:this.props.nowPage+1)}> href="#none">» onClick={this.props.onPagination.bind(this,Math.ceil(this.props.totalRows/this.props.listRows))}>lastpage ):( className="pagination"> No data ) ); } }); |
CopyRight 2018-2019 实验室设备网 版权所有 |