Twitter bootstrap v-if防止引导下拉扩展

我在一个v-if语句中发现了一个非常奇怪（没有提及令人沮丧）的问题。基本上，我试图根据用户权限隐藏一个边栏下拉菜单，当我添加v-if语句时，当用户刚刚登录时，下拉菜单停止工作；然后，当用户刷新页面时，一切正常

<li v-if="getUser.permissions && getUser.permissions.includes('some-permission')" >
      <a data-toggle="dropdown" class="dropdown-toggle" href="#">
          <i class="fa fa-flask"></i><span v-show="isMaximized">Genetics<i class="fa arrow"></i></span>
      </a>
      <ul class="nav nav-second-level collapse">
          <li>
              <router-link to="/route1"><i class="fa fa-bar-chart"></i> <span class="nav-label">Element 1</span></router-link>
          </li>
          <li>
              <router-link to="/route2"><i class="fa fa-refresh"></i> <span class="nav-label">Element 2</span></router-link>
          </li>
          <li>
              <router-link to="/route3"><i class="fa fa-list"></i> <span class="nav-label">Element 3</span></router-link>
          </li>
          <li>
              <router-link to="/route4"><i class="fa fa-leaf"></i> <span class="nav-label">Element 4</span></router-link>
          </li>
      </ul>
  </li>

要素1


要素2


要素3


要素4

如果我删除检查权限的v-If，下拉菜单工作正常，但是如果我把它放回去，用户需要刷新页面才能正常工作

注意：getUser是获取用户信息的vuex getter。加载主组件时，用户信息通过vuex操作从本地存储中获取，然后保存到名为user的变量中的应用程序状态中，该变量由我前面提到的getter返回

---

有什么想法可能会影响它，甚至有什么解决办法吗？

正如我正确理解的那样，您需要在

v-if

生效并显示元素之后手动调用

$（'.element'）。dropdown（）

---

就个人而言，我会将此元素提取到组件中，并在

mounted（）

lifecycle事件中调用

$（'.element'）.dropdown（）

，但当然还有其他方法：）

正如我正确理解的那样，您需要手动调用

$（'.element'）。dropdown（）

，就在

v-if

生效并显示元素之后

---

---

就我个人而言，我会将此元素提取到组件中，并在

mounted（）

lifecycle事件中调用

$（'.element'）.dropdown（）

，但当然还有其他方法：）

控制台中有错误吗？另外，您可以定义“不工作”吗？什么都不做。您使用的是什么版本的引导？我使用的是引导v3.3.6。您似乎缺少一些基本的引导下拉类，如

下拉菜单

（在容器上）和菜单列表上的

下拉菜单

。这是一个正在运行的演示~您的控制台中有错误吗？另外，您可以定义“不工作”吗？什么都不做。您使用的是什么版本的引导？我使用的是引导v3.3.6。您似乎缺少一些基本的引导下拉类，如

下拉菜单

（在容器上）和菜单列表上的

下拉菜单

。这是一个工作演示~刚刚尝试了这个，但没有成功：（在我的

挂载的

函数中，我添加了

$（“#遗传学下拉菜单”）.dropdown（）；

是

#遗传学下拉菜单

内部的

ul

（应该包含下拉菜单的那一个。我添加错了吗？为了确保我的观点有效，

v-show

而不是

v-if

？不，Bootstrap在

文档

级别使用事件委派来检测

[data toggle=“dropdown”]

element我遇到了一个问题，我在导航栏中有多个下拉菜单。根据某种情况，我使用v-if/else在它们之间切换。但这不起作用。我尝试了v-show，效果很好。只是尝试了一下，但没有成功：（在我的

挂载的
函数中，我添加了
$（“#遗传学下拉菜单”）。dropdown（）
是
#遗传学下拉菜单
内部
ul
（应该包含下拉菜单的那一个。我添加它错了吗？只是为了确保我的观点有效，
v-show
而不是
v-if
）工作吗？不，Bootstrap在
文档
级别使用事件委托来检测
上的事件[data toggle=“dropdown”]
element我的问题是导航栏中有多个下拉菜单。根据某种情况，我使用v-if/else在它们之间切换。但这不起作用。我尝试了v-show，效果非常好。