How to use router-link with ui-nav-item about balm-ui HOT 8 CLOSED

<ui-nav>
  <template v-for="(item, index) in menu" :key="index">
    <router-link v-slot="{ href, isActive }" :to="{ name: item.url }">
      <ui-nav-item :href="href" :active="isActive"></ui-nav-item>
    </router-link>
  </template>
</ui-nav>

<template>
  <!-- Drawer -->
  <ui-drawer v-model="open" type="modal">
    <ui-drawer-header>
      <ui-drawer-title>Test</ui-drawer-title>
    </ui-drawer-header>
    <ui-drawer-content>
      <ui-nav>
        <template v-for="(item, index) in links" :key="index">
          <router-link
            v-slot="{ href, isActive }"
            custom
            :to="{ name: item.url }"
          >
            <ui-nav-item
              :href="href"
              :active="isActive"
              @click.prevent="onLink(item)"
              >{{ item.name }}</ui-nav-item
            >
          </router-link>
        </template>
      </ui-nav>
    </ui-drawer-content>
  </ui-drawer>
  <ui-drawer-backdrop></ui-drawer-backdrop>
  <!-- Content -->
  <div class="demo-content">
    <!-- App bar -->
    <ui-top-app-bar
      fixed
      class="demo-app-bar"
      content-selector=".demo-app-content"
      @nav="balmUI.onOpen('open')"
    >
      Test
    </ui-top-app-bar>
    <!-- App content -->
    <div class="demo-app-content">
      <p v-for="i in 24" :key="i">Main Content {{ i }}</p>
    </div>
  </div>
</template>