Reactjs-Pagination 正在参加 2020 年度 OSC 中国开源项目评选,请投票支持!
Reactjs-Pagination 在 2020 年度 OSC 中国开源项目评选 中已获得 {{ projectVoteCount }} 票,请投票支持!
投票让它出道
已投票
Reactjs-Pagination 获得 2020 年度 OSC 中国开源项目评选「最佳人气项目」 !
Reactjs-Pagination 获得 2020 年度 OSC 中国开源项目评选「最佳人气项目」「最积极运营项目」 !
Reactjs-Pagination 获得 2020 年度 OSC 中国开源项目评选「最积极运营项目」 !
授权协议 MIT
开发语言 JavaScript
操作系统 跨平台
软件类型 开源软件
所属分类 Web应用开发网页组件
开源组织
地区 国产
适用人群 未知
收录时间 2016-08-16

软件简介

Reactjs-Pagination是一个React的本地分页组件,支持页码、跳转、和迷你模式。文档

安装

npm install --save reactjs-pagination

使用示例代码:

import React, { Component } from 'react';
import { Pagination }from 'reactjs-pagination';
 
class Test extends Component {
    state = {
        totalNumber: 326,
        pageSize: 10,
        currentPage: 31
    };
    constructor(props) {
        super(props);
        setTimeout(() => {
            // this.setState({ 
            // 	currentPage: 15 
            // }); 
            this.setState({
                totalNumber: 125
            });
        }, 3000);
    }
    handleChange = (idx) => {
        console.log('页码改变 => ', idx);
    }
    render() {
        const { totalNumber, pageSize, currentPage } = this.state;
 
        return (
            <div>
                <Pagination
                    totalNumber={totalNumber}
                    pageSize={pageSize}
                    currentPage={currentPage}
                    middlePage={5}
                    onChange={this.handleChange}
                    showPages
                    showGo
                />
            </div>
        )
    }
}
展开阅读全文

代码

评论 (0)

加载中
更多评论
暂无内容
发表于大前端专区
2015/03/30 22:12

reactjs

这个账号主要用于reactjs相关技术推广。

0
0
发表于大前端专区
2017/10/18 16:59

reactjs学习

### 概述 1. webpack 相当于编译程序 es5,6 编译成浏览器能够识别的标签 1. 利用import等 js功能实现分模块开发 1. 前端使用nodejs作为简易的web容器 [源码01](https://gitee.com/demo-lf/reactjs/tree/master/demo01)

0
0
发表于大前端专区
2020/04/03 14:46

`Reactjs`常用 `Hooks`

# `Reactjs`常用 `Hooks` ### 1. useClippy 用来复制数据到剪切板的 hook, `clipboard`是剪切板中的数据, `setClipboard`用来向剪切板中设置数据. ```javascript import useClippy from "use-clippy" function Component() { const [ clipboard, setClipboard ] = useClipy() return ( Clipboard {clipboard} setClipboard("nnamdi")}>Set Clipboard ) } ``` ### 2. useBrowserContextCommunication useBrowserContextCommunic...

0
0
发表于数据库专区
2020/01/18 15:55

快速学习ReactJS-简介

2.2、ReactJS简介 官网: https://reactjs.org/ 官方一句很简单的话,道出了什么是ReactJS,就是,一个用于构建用户界面的JavaScript框架,是Facebook开发的一款的JS框架。 ReactJS把复杂的页面,拆分成一个个的组件,将这些组件一个个的拼装起来,就会呈现多样的页面。ReactJS可以用 于 MVC 架构,也可以用于 MVVM 架构,或者别的架构。 ReactJS圈内的一些框架简介: Flux Flux是Facebook用户建立客户端Web应用的前端架构, 它...

0
0
2015/04/29 11:07

Thinking in ReactJS and Flux

# About Dispatcher > When new data comes into the dispatcher, it then uses these callbacks to propagate that data to all of the stores 换句话说,所以异步的事情,例如向服务器获取数据,应该是在Dispatch之前完成的,当data flow到store之后,马上就会反映到view上面去。 # 如果Store之间存在依赖关系 > As an application grows, dependencies across different stores are a near certainty. Store A will inevita...

0
1
发表了博客
2018/07/04 14:41

reactjs 学习网址

https://reactjs.org/ https://github.com/facebook/react/releases http://react-china.org/ http://react-china.org/t/react-js/398 http://www.ruanyifeng.com/blog/2015/03/react.html https://baijiahao.baidu.com/s?id=1576342904585845915&wfr=spider&for=pc...

0
0
2020/11/12 16:54

ReactJS集成openinstall

React作为前端流行框架之一,目前使用人数越来越多,与openinstall提供的第三方SDK相结合即可简单实现网页拉起应用并传递参数的场景。以下是在react组件中进行openinstall的web集成。 //在线加载JS <scripttype="text/javascript"charset="UTF-8"src="//web.cdn.openinstall.io/openinstall.js"></script> <script type="text/babel"> var data = OpenInstall.parseUrlParams();//解析链接后面拼接参数 class Test ...

0
0
发表了博客
2018/07/04 10:39

ReactJs入门教程-精华版

原文地址:https://www.cnblogs.com/Leo_wl/p/4489197.html 阅读目录 ReactJs入门教程-精华版 回到目录 ReactJs入门教程-精华版 现在最热门的前端框架有AngularJS、React、Bootstrap等。自从接触了ReactJS,ReactJs的虚拟DOM(Virtual DOM)和组件化的开发深深的吸引了我,下面来跟我一起领略ReactJs的风采吧~~ 文章有点长,耐心读完,你会有很大收获哦~ 一、ReactJS简介   React 起源于 Facebook 的内部项目,因为该公司对市...

0
0
没有更多内容
加载失败,请刷新页面
点击加载更多
加载中
下一页
暂无内容
0 评论
6 收藏
分享
OSCHINA
登录后可查看更多优质内容
返回顶部
顶部