How to remove the transition effect from the VuetifyJS Vertical Stepper?

问题

Is it possible to show the next step directly after clicking continue within the Vuetify Stepper? (or in other words: how to remove the transition slide out effect)

回答1:

It doesn't look like there is any provided option to change the transition effect in the Vue component itself.

But, you can disable it by setting the transition css property to none for the .stepper-content elements.

For example, you could create a no-transition class:

.no-transition .stepper__content { transition: none; }

And then add it to the <v-stepper> component tag:

<v-stepper v-model="e1" class="no-transition">
  ...
</v-stepper>

Here's a codepen with a working example.

回答2:

Mine worked with

.no-transition .v-stepper__content { transition: none; }

In case somebody didn’t succeed with @thanksd's answer.

来源：https://stackoverflow.com/questions/50315624/how-to-remove-the-transition-effect-from-the-vuetifyjs-vertical-stepper