react.js 翻页插件

发布时间：2020-12-15 07:36:01 所属栏目：百科来源：网络整理

导读：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

 
 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< 
 1) 

{

 
 this. 
 props. 
 nowPage= 
 1; 

}

 
 var  
 show_count_mid= 
 show_count/ 
 2; 

 
 var  
 pages = []; 

 
 for( 
 var  
 i= 
 1; 
 i<= 
 show_count; 
 i++) 

{

 
 var  
 page= 
 0; 

 
 if( 
 nowPage<= 
 show_count_mid) 

{

 
 page = 
 i; 

}

 
 else if( 
 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<= 
 totalPage) 

{

 
 pages. 
 push(< 
 li  
 onClick 
 ={ 
 this. 
 props.onPagination. 
 bind( 
 this,page)}>< 
 a>{ 
 page}</ 
 a></ 
 li>); 

}

}

 
 else 

{

 
 pages. 
 push(< 
 li  
 className 
 ="active">< 
 a>{ 
 page}</ 
 a></ 
 li>); 

}

}

 
 this. 
 pagesbutton= 
 pages; 

 
 return ( 

 
 this. 
 props.totalRows> 
 0?( 

  < 
 ul  
 className 
 ="pagination"> 

  < 
 li>< 
 a>Total:{ 
 this. 
 props.totalRows} { 
 this. 
 props. 
 nowPage}/{ 
 Math. 
 ceil( 
 this. 
 props.totalRows/ 
 this. 
 props.listRows)}</ 
 a></ 
 li> 

  < 
 li  
 onClick 
 ={ 
 this. 
 props.onPagination. 
 bind( 
 this,1)}>< 
 a>firstpage</ 
 a></ 
 li> 

  < 
 li  
 onClick 
 ={ 
 this. 
 props.onPagination. 
 bind( 
 this,this. 
 props. 
 nowPage== 
 1? 
 1: 
 this. 
 props. 
 nowPage- 
 1)}>< 
 a  
 href 
 ="#none"> 
 &laquo;</ 
 a></ 
 li> 

  { 
 this. 
 pagesbutton} 

  < 
 li  
 onClick 
 ={ 
 this. 
 props.onPagination. 
 bind( 
 this,this. 
 props. 
 nowPage== 
 this. 
 props.totalPage? 
 this. 
 props.totalPage: 
 this. 
 props. 
 nowPage+ 
 1)}> 

  < 
 a  
 href 
 ="#none"> 
 &raquo;</ 
 a> 

  </ 
 li> 

  < 
 li  
 onClick 
 ={ 
 this. 
 props.onPagination. 
 bind( 
 this,Math. 
 ceil( 
 this. 
 props.totalRows/ 
 this. 
 props.listRows))}>< 
 a>lastpage</ 
 a></ 
 li> 

  </ 
 ul> 

):(

  < 
 ul  
 className 
 ="pagination"> 

  < 
 li>< 
 a>No data</ 
 a></ 
 li> 

  </ 
 ul> 

)

);

}

});

  当前应该还存在Bug，请读者自行修复 

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!