FormSlider

Ползунок формы, объединяющий FormItem, информационный Alert и Slider.

Основа компонента

Компонент построен на Slider и Form из Ant Design Vue.

Привязка к модели формы

Если данный компонен расположен внутри Form достаточно указать name:, отдельный v-model не требуется.

vue

<script setup lang="ts">
import { reactive } from 'vue'
import { Form, FormSlider } from '@minitwiks/nsmp-vue-components'

const model = reactive({ volume: 35 })
</script>

<template>
  <Form :model="model">
    <FormSlider
      label="Громкость"
      name="volume"
      description="Выберите комфортный уровень"
      :min="0"
      :max="100"
      :step="5"
    />
  </Form>
</template>

Быстрые props: value, label, name, rules, description, min, max и step. Все остальные настройки передаются через formItemProps, alertProps и sliderProps. Компонент отправляет update:value, change и afterChange.

FormSlider ​

FormSlider