在Bootstrap 4中的下拉菜单项的同一行插入链接

Question

我想让一个下拉菜单项有一个单独的链接指向＆＃34;这是什么？＆＃34;选项。之前的一个问题是针对bootstrap3查看的，它使用html list语法进行下拉（<li>等）：
bootstrap dropdown menu Two links on same horizontal row

下拉菜单的语法现在有所不同（略微简化）：

<div class="dropdown">
  <button class="btn"> Dropdown button</button>
  <div class="dropdown-menu">
    <a class="dropdown-item" href="#">Action 1</a>
    <a class="dropdown-item" href="#">Action 2</a>
    <a class="dropdown-item" href="#">Action 3</a>
  </div>
</div>

在这种情况下，我想在其中一个下拉菜单项的右侧插入另一个链接（例如，操作2）？

<a href = "#">What's this?</a>

此图片显示了我的目标：

注意我没有尝试在此下拉项目中插入额外的下拉菜单：我只想要一个简单的链接到下拉项目2的右侧。

当我尝试在动作2之后插入此时，它只是一个单独的行。显然我无法将其嵌入到锚点内（我只是为了好玩而尝试它，链接/文本出现但没有做任何事情，如预期的那样）。

Answer 1

将dropdown-item设为DIV并在其中加入2个链接......

https://www.codeply.com/go/MzI65YRv7Q

<div class="dropdown">
  <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown">
    Dropdown button
  </button>
  <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
    <a class="dropdown-item" href="#">Action 1</a>
    <div class="dropdown-item" href="#">
        <a class="text-dark" href="#1">Action 2</a>
        <a class="" href="#2">[what's this?]</a>
    </div>
    <a class="dropdown-item" href="#">Action 3</a>
  </div>
</div>