如何不检测<a> tag to routing in Vue component

Question

How to disable <a> tag routing?

I am building a vueJS frontend page including tab. The tab includes <a> tag for nav (no JavaScript). I want this switching tab by <a> tag but whenever I click, route is changed, not switching tabs.

<nav class="w-100">
  <div
    class="nav nav-tabs nav-fill d-flex w-100"
    role="tablist"
  >
    <a
      class="nav-item nav-link flex-fill active"
      data-toggle="tab"
      href="#nav-home"
      role="tab"
      aria-controls="nav-home"
      aria-selected="true"
      target="_self"
    >
      {{ tabList[0] }}
    </a>
    <a
      class="nav-item nav-link flex-fill"
      data-toggle="tab"
      href="#nav-profile"
      role="tab"
      aria-controls="nav-profile"
      aria-selected="false"
      target="_self"
    >
      {{ tabList[1] }}
    </a>
    <a
      class="nav-item nav-link flex-fill"
      data-toggle="tab"
      href="#nav-contact"
      role="tab"
      aria-controls="nav-contact"
      aria-selected="false"
      target="_self"
    >
      {{ tabList[2] }}
    </a>
  </div>
</nav>
<div
  id="nav-tabContent"
  class="tab-content w-100"
  aria-labelledby="nav-home-tab"
>
  <div
    id="nav-home"
    class="tab-pane fade show active w-100 row mx-0"
    role="tabpanel"
  >
    <p class="mb-0 mt-2 ml-2 text-left">
      {{ carListRecent.carPart1 }}
    </p>
    <div class="d-flex scroll-card">
      <div
        v-for="(car, index) in carListRecent.cars1"
        :key="index"
        class="col-8 p-2"
      >
        <CarCard
          :price="car.price"
          :image="car.image"
          :year="car.year"
          :checked="car.checked"
          :car-name="car.name"
          :car-lg="true"
        />
      </div>
    </div>
    <p class="mb-0 ml-2 text-left">
      {{ carListRecent.carPart2 }}
    </p>
    <div class="d-flex flex-wrap">
      <div
        v-for="(car, index) in carListRecent.cars2"
        :key="index"
        class="col-6 p-2"
      >
        <CarCard
          :price="car.price"
          :image="car.image"
          :year="car.year"
          :checked="car.checked"
          :car-name="car.name"
        />
      </div>
    </div>
  </div>