任何子菜单处于活动状态时，如何使“菜单文本”也处于活动状态对我来说，活动的“菜单文本”的颜色更改就可以了

如何解决任何子菜单处于活动状态时，如何使“菜单文本”也处于活动状态对我来说，活动的“菜单文本”的颜色更改就可以了

VueJ，jquery或css是否有可能在任何子菜单处于活动状态时使边栏也处于活动状态。我的意思是，子菜单激活时，它只会更改“菜单文本”的文本颜色。同样，当我的任何子菜单打开时，即使我重新加载页面，它也会切换为打开状态。

我尝试过的jQuery代码。它使子菜单也处于活动状态，但“菜单文本”也处于活动状态，但是如果我再次单击该文本，它将在所有侧栏处于活动状态。还将激活其中的所有子菜单图标。

function dropdownMenu(e) {
  $(".sidebar-submenu").slideUp(200);
  if ($(e.target.parentElement.parentElement).hasClass("router-link-active")) {
    $(".sidebar-dropdown").removeClass("router-link-active");
    $(e.target.parentElement.find('.menu-text')).removeClass("router-link-active");
  } else {
    $(".sidebar-dropdown").removeClass("router-link-active");
    $(e.target.parentElement).next(".sidebar-submenu").slideDown(200);
    $(e.target.parentElement.find('.menu-text')).addClass("router-link-active");
  }
}

<li class="sidebar-dropdown">
  <a href="#" onclick="dropdownMenu(e);">
    <i class="fas fa-file-invoice-dollar"></i>
    <span class="menu-text">Billing Data</span>
  </a>
  <div class="sidebar-submenu">
    <ul>
      <li>
        <router-link to="/new"><i class="fas fa-box"></i>Unopenned/New
        </router-link>
      </li>
      <li>
        <router-link to="/underprocess"><i class="fas fa-user-md"></i>Under Process</router-link>
      </li>
      <li>
        <router-link to="closed"><i class="fas fa-times"></i>Closed</router-link>
      </li>
    </ul>
  </div>
</li>