Twitter bootstrap 引导4-两个带下拉菜单的按钮-第二个按钮显示第一个按钮'；内容

我添加了2个按钮（引导4）和下拉功能

第一个按钮正确显示其内容。 第二个按钮显示第一个按钮的内容

我创建了一个JSFIDLE来重现这个问题：

按钮1
按钮2

我找到了解决方案

按钮和下拉菜单容器需要用一个div包装，该div的类别为btn group：

按钮1
按钮2

或

下拉列表

，请参见官方文档：

<div class="btn-group">
  <button type="button" class="btn btn-default btn-sm mr-1 dropdown-toggle"
          id="button1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Button 1
  </button>
  <div aria-labelledby="button1"
       class="dropdown-menu dropdown-menu-right">
    <a href="#" class="dropdown-item">
      Item 1
    </a>
    <a href="#" class="dropdown-item">
      Item 2
    </a>
  </div>
</div>

<div class="btn-group">
  <button type="button" class="btn btn-default btn-sm mr-1 dropdown-toggle"
          id="button2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    Button 2
  </button>
  <div aria-labelledby="button2"
       class="dropdown-menu dropdown-menu-right">
    <a href="#" class="dropdown-item">
      Item 3
    </a>
  </div>
</div>