分页组件

import React from 'react';class Pagination extends React.Component {

  constructor(props) {

    super(props);

    this.state = {

      currentPage: 1,

      totalPages: Math.ceil(this.props.totalItems / this.props.itemsPerPage),

    };

  }

  componentDidUpdate(prevProps) {

    if (prevProps.totalItems !== this.props.totalItems || prevProps.itemsPerPage !== this.props.itemsPerPage) {

      this.setState({

        totalPages: Math.ceil(this.props.totalItems / this.props.itemsPerPage),

      });

    }

  }

  handlePageChange = (pageNum) => {

    this.setState({

      currentPage: pageNum,

    });

    this.props.onPageChange(pageNum);

  };

  render() {

    const { currentPage, totalPages } = this.state;

    const pageNumbers = [];

    for (let i = 1; i <= totalPages; i++) {

      pageNumbers.push(i);

    }

    return (

      this.handlePageChange(currentPage - 1)}>              Previous{pageNumbers.map((pageNum) => (this.handlePageChange(pageNum)}>                {pageNum}))}this.handlePageChange(currentPage + 1)}>              Next    );

  }

}export default Pagination;