我有一个 React-Redux 应用程序，我创建了一个“侧边栏”组件，我想在其中切换每个菜单项的“活动”类 onClick。

我拥有的当前代码在所有菜单项上切换“活动”类。

这是我的代码：

import React, {Component} from 'react'
import {connect} from 'react-redux'

export default class Sidebar extends Component {
constructor(props) {
    super(props)

    this.toggleClass= this.toggleClass.bind(this);
    this.state = {
      activeIndex: false
    }
}

toggleClass(e) {
    const currentState = this.state.activeIndex;
    this.setState({ activeIndex: !currentState });
};

render(){
    return(
        <div id="sidebar">
            <div className="nav">
                <ul className="dashboard-menu">
                    {this.renderSidebarMenuItems}
                    <li className={this.state.activeIndex ? 'active': null}  onClick={this.toggleClass}>Menu item 1</li>
                    <li className={this.state.activeIndex ? 'active': null}  onClick={this.toggleClass}>Menu item 2</li>
                    <li className={this.state.activeIndex ? 'active': null}  onClick={this.toggleClass}>Menu item 3</li>
                    <li className={this.state.activeIndex ? 'active': null}  onClick={this.toggleClass}>Menu item 4</li>
                </ul>
            </div>
        </div>
    )
}

}

我需要一个解决方案，使每个菜单项的 onClick 只有元素类更改为“活动”，所有其他菜单项返回空类。

谢谢