如何在vuetify中自定义范围滑块刻度？

<template>
  <v-slider
    v-model="value"
    :range="true"
  ></v-slider>
</template>

<template>
  <v-slider
    v-model="value"
    :range="true"
  >
    <template v-slot:append-outer>
      <div class="custom-ticks">
        <!-- 自定义刻度 -->
      </div>
    </template>
  </v-slider>
</template>

<template>
  <v-slider
    v-model="value"
    :range="true"
  >
    <template v-slot:append-outer>
      <div class="custom-ticks">
        <div
          v-for="tick in ticks"
          :key="tick"
          class="tick"
        >
          {{ tick }}
        </div>
      </div>
    </template>
  </v-slider>
</template>

<script>
export default {
  data() {
    return {
      value: [0, 50],
      ticks: [0, 25, 50, 75, 100] // 自定义刻度的值
    };
  }
};
</script>

<style>
.custom-ticks {
  display: flex;
  justify-content: space-between;
  margin-top: 8px;
}

.tick {
  width: 2px;
  height: 8px;
  background-color: #000;
}
</style>