Skip to main content

label

Description​

Optional. Sets a label above the slider bar

Usage​

label?: string;

Example​

<script setup>
  import { ref } from "vue";

  const value = ref(50);
</script>

<template>
  <Slider :label="`Progress: ${value}`" v-model:value="value" />
</template>

Details​

By default, a label is placed above the slider. It is also possible to put a label to the left of a slider with the help of the <Field> component. Read the details in the related article.

Related article: Adding a label

Related sample: Slider