为什么同一个vue组件上的多个引导程序下拉菜单共享相同的选项？

Question

我在同一个Vue.js组件中有两个下拉菜单。由于某些原因，第二个下拉菜单中的选项不会出现。相反，第二个下拉菜单显示与第一个下拉菜单相同的选项。这是为什么？

    <div class="d-flex">
      <div data-toggle="dropdown">
        <a href="#" class="btn btn-secondary ml-4_5">
          Dropdown1
          <i class="fal fa-angle-down"></i
        ></a>
        <ul class="dropdown-menu dropdown-menu-arrow">
          <li>

              Option A
            </li>
            <li> Option B
          </li>
        </ul>
      </div>               
      <div data-toggle="dropdown">
        <a href="#" class="btn btn-secondary ml-4_5">
        Dropdown2
          <i class="fal fa-angle-down"></i
        ></a>
        <ul class="dropdown-menu dropdown-menu-arrow">
          <li>
              Option 1</li>
            <li>Option 2
          </li>
        </ul>
      </div>  
     </div>

Answer 1

data-toggle应该是标记的属性，它将切换下拉菜单。将属性移到锚标记，它将正常工作。