Vuetify：如何修改步骤的默认颜色？

Question

我正在使用Vuetify的Stepper组件。

默认情况下，步骤的颜色为蓝色：

相应的代码是：

<v-stepper-step :complete="e1 > 1" step="1">Name of step 1</v-stepper-step>

在Codepen上进行实时测试。

Answer 1

您可以使用CSS覆盖默认颜色。元素为v-stepper__step__step .primary ：

.v-stepper__step__step.primary {
    background-color: red !important;
    border-color: red !important;
}

Answer 2

You can simply pass a color to color attribute on v-stepper-step component.

<v-stepper-step color="red">Step 1</v-stepper-step>

Custom theme colors e.g. color="success" will work as well.