在Bootstrap 4中隐藏菜单

Question

我有一个问题想解决或寻求替代方法。

我有一个用bootstrap 4和navbar用dropdown制作的菜单，在这里很好。

代码如下：

<nav class="navbar navbar-expand-lg navbar-dark bg-dark navbar-static" role="navigation">
    <a class="navbar-brand" href="#">Menu</a>
     <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#menu" aria-controls="menu"
        aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
     </button>
 <div class="collapse navbar-collapse" id="menu">
 <ul class="navbar-nav">

            <li class="nav-item dropdown has-mega-menu active">
                <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
                    Gestión
                </a>

                <div class="dropdown-menu">
                    <div class="px-0 container container-md">
                        <div class="row">
                            <div class="col-sm-6 col-md-x">

                                    <a class="dropdown-header">Tramitar</a>
                                    <a class="dropdown-item" href="#">Tramitar</a>
                                    <div class="dropdown-divider"></div>
                                    <a class="dropdown-header">Escritos</a>
                                    <a class="dropdown-item" href="#">Ingresar Escritos</a>
                                    <a class="dropdown-item" href="#">Consultar Escritos</a>

                            </div>
                            <div class="col-sm-6 col-md-x">

                                    <a class="dropdown-header">Plazos</a>
                                    <a class="dropdown-item" href="#">Búsqueda de Plazos</a>
                                    <a class="dropdown-item" href="#">Abandono de Procedimiento Masivo</a>
                                    <a class="dropdown-item" href="#">Causas Sin Movimiento (6 Meses)</a>

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

            </li>

            <li class="nav-item dropdown has-mega-menu active">
                <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
                    Adm. General
                </a>

                <div class="dropdown-menu">
                    <div class="px-0 container container-md">
                        <div class="row">
                            <div class="col-sm-6 col-md-x">

                                    <a class="dropdown-header">Notificación</a>
                                    <a class="dropdown-item" href="#">Notificación</a>
                                    <a class="dropdown-item" href="#">Centro de Notificación</a>
                                    <a class="dropdown-item" href="#">Notificación Receptor</a>
                                    <a class="dropdown-item" href="#">Notificación por Email</a>
                                    <div class="dropdown-divider"></div>
                                    <a class="dropdown-header">Receptor</a>
                                    <a class="dropdown-item" href="#">Retiros</a>

                            </div>
                            <div class="col-sm-6 col-md-x">

                                    <a class="dropdown-header">Archivo</a>
                                    <a class="dropdown-item" href="#">Administración de Archivos</a>
                                    <a class="dropdown-item" href="#">Consultar Archivo</a>
                                    <div class="dropdown-divider"></div>
                                    <a class="dropdown-header">Recordatorio SMS</a>
                                    <a class="dropdown-item" href="#">Recordatorio SMS</a>

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

            </li>

            <li class="nav-item dropdown has-mega-menu active">
                <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
                    Atención Público
                </a>

                <div class="dropdown-menu">
                    <div class="px-0 container container-xs">
                        <div class="row">
                            <div class="col-sm-12 col-md-x">

                                    <a class="dropdown-header">Consulta de Causas</a>
                                    <a class="dropdown-item" href="#">Consulta de Causas</a>
                                    <div class="dropdown-divider"></div>
                                    <a class="dropdown-header">Consulta de Audiencias</a>
                                    <a class="dropdown-item" href="#">Consulta de Audiencias</a>

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

            </li>


            <li class="nav-item dropdown has-mega-menu active">
                <a class="nav-link" href="#" role="button">
                    Cerrar Sesión
                </a>

            </li>

        </ul>
    </div>
</nav>  

我用于菜单的css代码如下：

    @media screen and (min-width: 576px) {
         .has-mega-menu .container-sm {
            width: 540px;
         }

        .dropdown-header {
            color: #428bca;
            font-size: 18px;
        }
    }

    @media screen and (min-width: 768px) {
        .has-mega-menu .container-md {
            width: 720px;
        }

        .dropdown-header {
            color: #428bca;
            font-size: 18px;
        }
    }

    @media screen and (min-width: 992px) {
        .has-mega-menu .container-lg {
            width: 960px;
        }

        .dropdown-header {
            color: #428bca;
            font-size: 18px;
        }
    }

    @media screen and (min-width: 1200px) {
        .has-mega-menu .container-xl {
            width: 1140px;
        }

        .dropdown-header {
            color: #428bca;
            font-size: 18px;
        }
    }

当特定用户连接时，我需要隐藏整个菜单，但是我不知道是否有bootstrap，css或其他属性，可以让我完全隐藏菜单。

感谢您为隐藏菜单提供的帮助或指导。