Bootstrap 4：如何使下拉链接的头部在导航栏中可点击

Question

我正在使用 Bootstrap 4，并且有一个带有下拉链接的菜单项。除了可以使用下拉菜单选择其他内容之外，我还想让菜单项的文本成为可点击的链接。对此有好的解决办法吗？

例子：

    <li class="nav-item dropdown">
            <a class="nav-link dropdown-toggle data-toggle="dropdown" href="/link-i-want-clickable" role="button" aria-haspopup="true" aria-expanded="false" title="List tickets filtered by custom filter preset">Link I Want Clickable </a>
          <div class="dropdown-menu dropdown-menu-wide">
            <div class="row">

                        <div class="col-md-9 text-truncate">
                            <a href="/url1" id="customFilterPreset1" class="dropdown-item" title="title1">Link 1</a>
                        </div>

                        <div class="col-md-9 text-truncate">
                            <a href="/url2" id="customFilterPreset2" class="dropdown-item" title="title2">Link 2</a>
                        </div>

            </div>
        </div>
    </li>

Answer 1

使用data-hover标签而不是data-toggle

<li class="dropdown" data-dropdown="dropdown">
    <a href="URL" class="dropdown-toggle" data-hover="dropdown">Parent</a>
    <ul class="sub-menu dropdown-menu">
        <li class="nav-item"><a class="nav-link" href="#">Child 1</a></li>
        <li class="nav-item"><a class="nav-link" href="#">Child 2</a></li>
        <li class="nav-item"><a class="nav-link" href="#">Child 3</a></li>
    </ul>
</li>