使用相同的数据 - 激活两次

Question

我的home_header.blade.php中有2个导航，一个用于台式机/笔记本电脑屏幕，另一个用于移动屏幕。

<div class="home-header">
<nav id="mobile-nav" class="fixed-nav hide-on-med-and-up">
<div class="nav-wrapper">
    <a href="{{ url('/') }}" class="brand-logo center grey-text text-darken-2 hide-on-med-and-up">{{ Html::image('images/test-lettermark@3x.png', 'test') }}</a>
    <a href="{{ url('/') }}" class="brand-logo center grey-text text-darken-2 hide-on-small-and-down">{{ Html::image('images/test@3x.png', 'test') }}</a>
    <a href="#" data-activates="slide-out" class="button-collapse"><i class="material-icons">menu</i></a>.

    @include('web.includes.sidebar')
</div>
</nav>
<nav class="nav-extended hide-on-small-and-down" style="border-bottom-width: 0px">
<div class="nav-wrapper container">
    <a href="{{ url('/') }}" class="brand-logo center grey-text text-darken-2 hide-on-med-and-up">{{ Html::image('images/test-lettermark@3x.png', 'test') }}</a>
    <a href="{{ url('/') }}" class="brand-logo center grey-text text-darken-2 hide-on-small-and-down">{{ Html::image('images/test@3x.png', 'test') }}</a>
    <a href="#" data-activates="slide-out" class="button-collapse show-on-large"><i class="material-icons">menu</i></a>

    @include('web.includes.sidebar')
</div>

如您所见，两个导航使用相同的ID进行数据激活。出于某种原因，只有一个导航可以激活侧边栏，而另一个无法工作。

对我而言，两个导航都使用侧边栏的相同文件对我很重要。如果有人知道如何这样做，将不胜感激。谢谢！