How to remove v-tab transition slide in Vuetify?

Question

Is it possible to remove transition slide when click v-tabs ?

 <v-tabs v-model="tab" :transition="false" :reverse-transition="false">
        <v-tab href="#tab1" >
          tab1
        </v-tab>
        <v-tab href="#tab2">
          tab2
        </v-tab>
      </v-tabs>

This is not working

Answer 1

Possible when you use :transition=false with v-tab-item:

<v-tabs v-model="tab">
  <v-tab key="registration">Registration</v-tab>
  <v-tab key="login">Login</v-tab>
  <v-tabs-items v-model="tab">
     <v-tab-item key="registration" :transition="false">
        some content
     </v-tab-item>
     <v-tab-item key="login" :transition="false">
        some content
     </v-tab-item>
  </v-tabs-items>
</v-tabs>

Unfortunately :transition="false" is not working on v-tabs level ("vuetify": "2.4.0")

Answer 2

Write this in your scss style tag:

.v-tabs {
  ::v-deep {
    .v-tabs-slider-wrapper {
      transition: none;
    }
  }
}