Javascript React中分页中的活动类

我已经做了分页，一切正常，但我不知道如何在单个页面上设置活动类

这是我的例子：

分页代码：

    const renderPagination = numbers.map(number => {
        return (
            <li className="controls" key={number} id={number} onClick={this.handlePages}>
                {number}
            </li>
        );
    });

完整示例：

当状态等于数字时，可以添加类

当状态等于数字时，可以添加类

由于当前页面处于状态，您可以从那里获取它，并将其与正在显示的页面链接的编号进行比较

    const renderPagination = numbers.map(number => {
        var activeClass = this.state.currentPage === number ? 'active' : '';
        return (
            <li className={`controls ${activeClass}`} key={number} id={number} onClick={this.handlePages}>
                {number}
            </li>
        );
    });

使用一些样式更新了演示：

由于当前页面处于状态，您可以从那里获取它，并将其与正在显示的页面链接数进行比较

    const renderPagination = numbers.map(number => {
        var activeClass = this.state.currentPage === number ? 'active' : '';
        return (
            <li className={`controls ${activeClass}`} key={number} id={number} onClick={this.handlePages}>
                {number}
            </li>
        );
    });

---

更新了带有一些样式的演示：

你是说页面切换元素的按钮上？比如在第二页突出显示按钮2？是的，这就是我的意思。@neil，你特别犯了一个错误，需要在文章中包含你的代码。试图通过将一些随机文本标记为代码来规避这一要求并不酷。请将您的代码插入您的帖子。您的意思是在页面切换元素的按钮上吗？比如在第二页突出显示按钮2？是的，这就是我的意思。@neil，你特别犯了一个错误，需要在文章中包含你的代码。试图通过将一些随机文本标记为代码来规避这一要求并不酷。请在您的帖子中插入您的代码。