FormNumber

Числовое поле формы, объединяющее FormItem, информационный Alert и InputNumber.

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

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

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

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

vue

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

const model = reactive({ age: 18 })
</script>

<template>
  <Form :model="model">
    <FormNumber
      label="Возраст"
      name="age"
      description="Допустимое значение — от 18 до 120"
      :min="18"
      :max="120"
      :rules="[{ required: true, message: 'Укажите возраст' }]"
    />
  </Form>
</template>

Быстрые props: value, label, name, rules, description, placeholder, min, max и step. Все остальные параметры доступны через formItemProps, alertProps и inputNumberProps. Через ref доступны focus() и blur().

FormNumber ​

FormNumber