将图标添加到Thumb Vuetifyjs刻度滑块

Question

我想添加一个图标，无论是SVG图标还是Fontawesome，我都不介意。

这是我正在使用的vuetifyjs代码

    <v-slider
      v-model="value"
      :tick-labels="ticksLabels1"
      class="step-slider"
      height="20px"
      :max="4"
      :color="ex1.color"
      :track-color="ex2.color"
      :thumb-color="ex3.color"
      step="1"
      tick-size="0"
    ></v-slider>

这就是我要实现的目标。

非常感谢您的帮助。

谢谢。

Answer 1

如果有人在挣扎，我可以使用CSS来做到这一点。

.v-slider__thumb:after {
    content: url();
    display: block;
    width: 18px;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    margin-top: 1px;
}

这是对我有用的代码。

杰克。