使用包含在导航选项卡子菜单中的bs4切换导航丸时遇到以下问题：

  • next url不会加载带有id2的药丸：http://localhost/test#option2虽然如果我点击它会切换到那个药丸 .

  • 当我使用id选项2打开药丸并且我进行页面刷新时，它会回到第一个药丸 - 具有id option1的药丸

  • 我需要为每个药丸提供一个功能性链接，应该打开特定的药丸，并且应该坚持页面刷新 - 我认为它被称为深度链接，但我发现的例子不同或旧 .

<nav>
    <div class="nav nav-tabs" id="nav-tab" >
        <a class="nav-item nav-link disabled" id="nav-menu1-tab" href="#">menu1</a>
        <a class="nav-item nav-link  active" id="nav-menu2-tab" href="#nav-menu2">active-tab</a>
        <a class="nav-item nav-link disabled" id="nav-menu3-tab" href="#">menu3</a>
    </div>
</nav>


<div class="tab-content" id="nav-tabContent">
    <div class="tab-pane fade show active" id="nav-menu2"></div>

    <ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
        <li class="nav-item">
            <a class="nav-link active" id="pills-option1-tab" data-toggle="pill" href="#option1" role="tab" aria-controls="pills-option1" aria-selected="true">option1</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" id="pills-option2-tab" data-toggle="pill" href="#option2" role="tab" aria-controls="pills-option2" aria-selected="false">option2</a>
        </li>
    </ul>
    <div class="tab-content" id="pills-tabContent">
        <div class="tab-pane fade show active" id="option1" role="tabpanel" aria-labelledby="pills-option1-tab">option1...</div>
        <div class="tab-pane fade" id="option2" role="tabpanel" aria-labelledby="pills-option2-tab">option2...</div>
    </div>

</div>
javascript bootstrap-4