Question

我需要使用react-paginate为项目列表创建分页。我的组件如下：

import React, { Component } from 'react';
import { connect } from 'react-redux';
import { Link, browserHistory } from 'react-router';
import ReactPaginate from 'react-paginate';

class AlbumsShow extends Component {

  getInitialState() {
    return {
      items: []
    }
  }
  onChangePage(page, album) {
    return request("album/" + album.id, {page: page}).then(function(items) {
      this.setState({items: items});
    }.bind(this));
  }

    renderImage(){

        return this.props.images.map((image) => {
            return(

                <li key={image.id}>                 
                        <img alt="job" src={image.img} />
                </li>

            );
        });
    }


    render(){

        return (

            <div>
                <div className="albums">
                    <div className="albums_caixa">
                        <div className="row">
                            <div className="col-md-12">
                                <ul className="no_pad">
                                    {this.renderImage()}
                                   <Paginator max={5} onChange={this.onChangePage}/>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        );
    }
}


function mapStateToProps(state){

    return {

        images: state.image

    };
}



export default connect(mapStateToProps)(AlbumsShow );

控制台显示错误＆＃39; request＆＃39;未定义 我需要以下路由路径到我的项目：/ album /：id / page /：page。

谢谢你的帮助！

Answer 1

如控制台所示，未定义onChangePage中的请求方法。通常在onChangePage函数中，您需要获取与该页面相关的一些数据。您可以使用其他方法，例如http://people.revoledu.com/kardi/tutorial/LinearAlgebra/MatrixOrthogonal.html。

与React-Paginate的分页

1 个答案: