如何从VuetifyJS Vertical Stepper中删除过渡效果？

Question

在Vuetify Stepper中点击继续后，是否可以直接显示下一步？ （或换句话说：如何删除过渡滑出效果）

Answer 1

看起来没有任何提供的选项可以更改Vue component itself中的过渡效果。

但是，您可以通过为transition元素的none css属性设置为.stepper-content来禁用它。

例如，您可以创建一个no-transition类：

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

然后将其添加到<v-stepper>组件标记：

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

Here's a codepen with a working example.

Answer 2

我与之合作

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

以防万一有人没有通过@thanksd的答案​​。

Answer 3

这对我有用：

.v-stepper__wrapper {
  transition:none !important;
}

Vuetify版本2.2.8