安装引导 4 alpha 6 后导航栏未显示任何链接

Question

我知道他们从 alpha 5 更改了导航栏，但是我找不到破坏我以前工作的导航栏的原因。 如果我将页面大小调整为 XS，则会出现汉堡包并且链接在那里，但我在 > XS 处得到的是一条没有任何内容的蓝线。

导航声明为：

<nav class="navbar navbar-inverse bg-primary">
    <button class="navbar-toggler hidden-sm-up" type="button" data-toggle="collapse" data-target="#exCollapsingNavbar">
    &#9776;
    </button>
    <div class="collapse navbar-toggleable-xs" id="exCollapsingNavbar">
        <a class="navbar-brand" href="/home">My Project</a>
        <ul class="nav navbar-nav">
            @if (Auth::check())
            <li class="nav-item"><a class="nav-link" href="/auth/logout">Logout</a></li>
            @else
            <li class="nav-item"><a class="nav-link" href="/auth/login">Login</a></li>
            @endif
            ///
        </ul>
    </div>
</nav>

有什么线索吗？

Answer 1

这是 alpha 6 的更新导航栏...

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

navbar-toggleable-xs 已更改为navbar-toggleable，需要进入navbar 元素。切换器将根据navbar-toggleable 断点隐藏，因此您可以删除hidden-sm-up。最后，将navbar-collapse 类添加到collapse。

<nav class="navbar navbar-inverse navbar-toggleable bg-primary">
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#exCollapsingNavbar">
    &#9776;
    </button>
    <div class="collapse navbar-collapse" id="exCollapsingNavbar">
        <a class="navbar-brand" href="/home">My Project</a>
        <ul class="nav navbar-nav">
            @if (Auth::check())
            <li class="nav-item"><a class="nav-link" href="/auth/logout">Logout</a></li>
            @else
            <li class="nav-item"><a class="nav-link" href="/auth/login">Login</a></li>
            @endif
            ///
        </ul>
    </div>
</nav>

---

对于 Bootstrap 4 Beta，navbar-toggleable-* 已更改为 navbar-expand-*，navbar-inverse 现在是 navbar-dark