Vuetify.js：如何在V-Stepper组件中更改步骤文本的颜色？

Question

在v-stepper VuetifyJS组件中，我知道如何通过简单地调用color道具来更改步骤本身的颜色，但是如何更改该步骤的文本？

我的意思是如何更改下面的步骤1的名称文本的颜色：

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

屏幕截图：

Codepen。

Answer 1

从技术上讲，如果您想使用Vuetify.js，可以在跨度中使用red--text类，如下所示：

<span class="red--text">Name of Step 1</span>

或者，如果您感到鲁ck和不负责任，则可以覆盖.v-stepper__label的CSS。

.v-stepper__label {
  color: red !important;
}

Answer 2

我刚刚回到这个问题，找到了一个简单的解决方案：

我刚刚包裹了<span style="color:red">Name of Step 1</span>

但是，如果您有使用Vuetify.js的方法，请告诉我。