vuetify v-slider：如何更改消息道具的顏色？

Question

我正在使用Vuetify滑塊並填充message屬性。 如何更改消息的顏色？

<v-slider app class="mx-4 my-0"
  v-model="currentNumCycles"
  thumb-label="always"
  thumb-color="red"
  track-color="red"
  min="1"
  max="10"
  ticks="always"
  step="1"
  tick-size="2"`enter code here`
  background-color="white"
  messages="Number of Cycles"
/>

編輯：我曾嘗試在我的CSS類.v-messages__message，但它不起作用。

.v-messages__message {
  color: white;
}

Answer 1

另一種選擇是將HTML元素傳遞給message屬性。

<v-slider app class="mx-4 my-0"
  v-model="currentNumCycles"
  thumb-label="always"
  thumb-color="red"
  track-color="red"
  min="1"
  max="10"
  ticks="always"
  step="1"
  tick-size="2"
  background-color="white"
  messages="<div class='white--text'>Number of Cycles</div>"
/>

Answer 2

Afaik沒有通過屬性更改它的選項，但是您可以通過CSS輕松更改它。

.my-0 .v-messages__message {
  color: #3a2424
}