如何更改/覆盖 vuetify 中开关标签的默认颜色？

Question

从 vuetify 的官方文档中可以看出，开关的标签有自己的预定义颜色。我如何覆盖它们以获得黑色文本？我将开关作为道具从一个名为 form structure 的全局组件传递到另一个我命名为“Primary”的组件

https://vuetifyjs.com/en/components/selection-controls

 <v-switch v-if="externalSwitch" model="switch2":label="externalSwitchLabel">
</v-switch>

<v-layout v-for="info in information" :key="info.title">
  <v-flex>
    <form-structure :externalSwitchLabel="`${info.title}`"
      :externalSwitch="true" :hasSubTitle="true" :subTitle="`${info.status}`"
      :script="`${info.script}`">
    </form-structure>
  </v-flex>
</v-layout>

我的阵列看起来像这样：

 information : [
  {title: "Something1", status:"active", script: "Hello"},
  {title: "Something2", status:"in Progress", script: "Ciao" }
]

我的 Css 看起来像这样：

 <style scoped>
.v-label.theme--light {
  color: black
}
</style>

原文由 user9996891 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

我尝试了插槽方法，它对我有用：

 <v-switch>
   <template v-slot:label>
      <span class="input__label">Label text</span>
   </template>
</v-switch>

CSS 看起来像这样：

 .input__label {
   color: black;
}

原文由 ABucin 发布，翻译遵循 CC BY-SA 4.0 许可协议