MVC bootstrap navbar not working after running NuG

2019-01-31 04:13发布

站内问答 / 前端开发
1641 8 5

An MVC app broke after we updated all the NuGet packages. After trying everything I created a new MVC app, updated the NuGet packages and the basic navbar...

<div class="navbar navbar-inverse navbar-fixed-top">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="/">Application name</a>
        </div>
        <div class="navbar-collapse collapse">
            <ul class="nav navbar-nav">
                <li><a href="/">Home</a></li>
                <li><a href="/Home/About">About</a></li>
                <li><a href="/Home/Contact">Contact</a></li>
            </ul>

<ul class="nav navbar-nav navbar-right">
    <li><a href="/Account/Register" id="registerLink">Register</a></li>
    <li><a href="/Account/Login" id="loginLink">Log in</a></li>
</ul>


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

... looks like this ...

NavBar

...and clicking the icon...

NavBar Open

Any ideas what could be causing this?

Have tried manually adding Bootstrap.css and Bootstrap.js to _Layout.vbhtml, but no difference

Thank you

8条回答
神经病院院长
2楼-- · 2019-01-31 04:51

Thanks Drac , great answer. For a "hamburger" button just like in version 3.3, add this code :

            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
查看更多
0人赞 添加讨论(0) 举报
地球回转人心会变
3楼-- · 2019-01-31 04:54

Late arrival but hope this helps someone as this issue was a struggle for me.

My toolbar was borked after updating from v3 to v4. Didn't work until I had the necessary references listed below. Please note that they are local references, but they should be similar to your project. 

<!DOCTYPE html>
<html>
<head>
   <!-- Latest compiled and minified CSS -->
    <link href="~/Content/bootstrap.min.css" rel="stylesheet" />
    <!-- jQuery library -->
    <script src="~/Scripts/jquery-3.3.1.min.js"></script>
    <!-- Popper JS -->
    <script src="~/Scripts/popper.min.js"></script>
    <!-- Latest compiled JavaScript -->
    <script src="~/Scripts/bootstrap.bundle.min.js"></script>
</head>
</html>

查看更多
0人赞 添加讨论(0) 举报
上一页 1 2
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(5)