小编Son*_*xon的帖子

我目前正在 REACT 中创建一个多级侧边栏菜单，我想<li>在当前路由处于活动状态时动态地将活动类添加到父级。

下面的代码是我为单个菜单执行此操作的方法。

<Route
  path={this.props.to}
  exact={this.props.activeOnlyWhenExact}
  children={({ match }) => (
    <li className={match ? "active" : ""}>
      <Link to={this.props.to} activeClassName="active">
        <span className="sidebar-mini-icon">
          <i className={this.props.icon}></i></span>
          {this.props.label}
      </Link>
    </li>
  )}
/>

现在我想知道如何使用多级菜单来做到这一点。我的菜单看起来像这样；

如您所见，只有菜单具有活动类。这是我的多级菜单代码：

<Route
  path={this.props.to}
  exact={this.props.activeOnlyWhenExact}
  children={({ match }) => (
  <li>
    <a data-toggle="collapse" href="#Collapse">
      <span className="sidebar-mini-icon">
        <i className={this.props.icon}></i>
      </span>
      <span className="sidebar-normal">
        {this.props.name}
        <b className="caret"></b>
      </span>
    </a>
    <div class="collapse" id="Collapse">
       <ul className="nav">
         {this.props.children}
       </ul>
    </div>
  </li>
  )}
/>

我正在使用反应路由器。任何帮助将不胜感激。谢谢。

很抱歉，我缺乏知识，但我是新手，目前正在学习。只想问一下我是否想在我的react应用程序中使用bootstrap 4，是否必须安装JQUERY？我在某处读到，将JQUERY与React一起使用是不行的。所以现在我在想。谢谢回复。您的意见和建议是真正的赞赏。