当分页项目在ReactJS中处于活动状态时如何更改颜色？

// React组件的CSS文件
.my-pagination {
  /* 分页项目的样式 */
}

.active-page {
  color: red; /* 活动状态下的颜色 */
}

// React组件
import React from 'react';
import './pagination.css';

class Pagination extends React.Component {
  render() {
    const { currentPage, totalPages } = this.props;

    return (
      <div className="my-pagination">
        {Array.from({ length: totalPages }, (_, index) => (
          <div
            key={index}
            className={currentPage === index + 1 ? 'active-page' : ''}
          >
            {index + 1}
          </div>
        ))}
      </div>
    );
  }
}

export default Pagination;