npm.io
0.1.0 • Published 8 years ago

react-web-pagination

Licence
ISC
Version
0.1.0
Deps
0
Vulns
0
Weekly
0

介绍

使用react做的分页组件

安装

    npm install react-web-pagination

API

参数 说明 类型 默认值
current 当前页数 number 无
pageSize 每页条数 number 10
pageSizeOptions 指定每页可以显示多少条 int[] [10,20,30,40]
showQuickJumper 是否可以快速跳转至某页 boolean false
showSizeChanger 是否可以改变 pageSize boolean false
showTotal 是否显示总item boolean false
total 数据总数 number 0
onChange 页码改变的回调,参数是改变后的页码及每页条数 Function(page, pageSize) 无

Auto Play效果

image

用法

import React, { Component } from "react";
import Pagination from "react-web-pagination";

class App extends Component {
  onChange(page,pageSize){
    console.log(page,pageSize)
  }
  render() {
    return (
      <div style={{ height: 200, width: "100%" ,padding:50}}>
        <Pagination total={100} pageSize={10} onChange={(page,pageSize)=>this.onChange(page,pageSize)} showSizeChanger showQuickJumper showTotal/>
      </div>
    );
  }
}

export default App;

Keywords