OcRange component

Description

The OcRange component allows users to select a value from a defined range.

Accessibility

The label property is required and represents the name of the input.

Examples

Default

The default use case needs a label and a v-model to bind the selected value.

<template>
  <oc-range v-model="value" label="Tile size" :min="1" :max="6" />

  <p>Selected value: {{ value }}</p>
</template>

<script setup lang="ts">
import { ref } from 'vue'

const value = ref(3)
</script>

Properties

Emits

Slots