<li :class="{'nav-item': true, show: show,

dropdown: !dropup, dropup: dropup}">

<a @click.stop="toggle($event)"

:class="['nav-link', dropdownToggle]"

href="" v-on:click.prevent=""

aria-haspopup="true"

:aria-expanded="show"

:disabled="disabled">

<slot>{{ text }}</slot>

<b-nav isNavBar class="ml-auto">

<b-nav-item-dropdown text="Lang">

<div slot="dropdown-menu">

<a href class="dropdown-item active">

EN

</a>

<a href class="dropdown-item">

ES

</a>

</div>

</b-nav-item-dropdown>

<b-nav-item-dropdown>

<span>User</span>

<div slot="dropdown-menu">

<a href class="dropdown-item">

Profile

</a>

<a href class="dropdown-item">

Sign out

</a>

</div>

</b-nav-item-dropdown>

</b-nav>

&lt;b-nav-toggle target=&quot;nav_collapse&quot;/&gt;

&lt;a class=&quot;navbar-brand&quot; to=&quot;/&quot;&gt;

&lt;span&gt;Bootstrap4&lt;/span&gt;

&lt;/a&gt;

&lt;b-collapse isNav id=&quot;nav_collapse&quot;&gt;

&lt;b-nav isNavBar&gt;

&lt;b-nav-item&gt;Support&lt;/b-nav-item&gt;

&lt;b-nav-item&gt;Docs&lt;/b-nav-item&gt;

&lt;b-nav-item&gt;Contact Us&lt;/b-nav-item&gt;

&lt;/b-nav&gt;

&lt;b-nav isNavBar class=&quot;ml-auto&quot;&gt;

&lt;b-nav-item-dropdown text=&quot;Lang&quot;&gt;

&lt;div slot=&quot;dropdown-menu&quot;&gt;

&lt;a href class=&quot;dropdown-item active&quot;&gt;

EN

&lt;/a&gt;

&lt;a href class=&quot;dropdown-item&quot;&gt;

ES

&lt;/a&gt;

&lt;/div&gt;

&lt;/b-nav-item-dropdown&gt;

&lt;b-nav-item-dropdown&gt;

&lt;span&gt;User&lt;/span&gt;

&lt;div slot=&quot;dropdown-menu&quot;&gt;

&lt;a href class=&quot;dropdown-item&quot;&gt;

Profile

&lt;/a&gt;

&lt;a href class=&quot;dropdown-item&quot;&gt;

Sign out

&lt;/a&gt;

&lt;/div&gt;

&lt;/b-nav-item-dropdown&gt;

&lt;/b-nav&gt;

&lt;/b-collapse&gt;