Unstyled menubar with boostrap classes

[goveebee]

I'm trying to create a unstyled webapp with bootstrap as UI-platform. But I cannot figure out how to create a standard bootstrap navbar, but in the Primevue way:

<template>
  <div class="card">
    <Menubar :model="items">
      <template #item="{ item, props, hasSubmenu }">
        <router-link v-if="item.route" v-slot="{ href, navigate }" :to="item.route" custom>
          <a v-ripple :href="href" v-bind="props.action" @click="navigate">
            <span :class="item.icon" />
            <span class="ml-2">{{ item.label }}</span>
          </a>
        </router-link>
        <a v-else v-ripple :href="item.url" :target="item.target" v-bind="props.action">
          <span :class="item.icon" />
          <span class="ml-2">{{ item.label }}</span>
          <span v-if="hasSubmenu" class="pi pi-fw pi-angle-down ml-2" />
        </a>
      </template>
    </Menubar>
  </div>
</template>

Can someone guide me in the right direction here?

[tugcekucukoglu]

This could be a starter https://primevue.org/bootstrap/. But I'm not sure Bootstrap Navbar is full compatible with PrimeVue Menubar.

[iprinter4]

Link goes to 404 .
I'm interested too how to use v4 with bootstrap and have no idea what to do.