Skip to content

FormCheckbox ​

Чекбокс формы с информационным Alert. В отличие от остальных Form-компонентов, он не выводит отдельный заголовок над контролом.

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

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

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

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

Подробнее — в документации Form.

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

const model = reactive({ accepted: false })
</script>

<template>
  <Form :model="model">
    <FormCheckbox
      label="Я принимаю условия"
      name="accepted"
      description="Подтвердите согласие перед продолжением"
    />
  </Form>
</template>

Prop label отображается справа от самого чекбокса и не создаёт отдельный заголовок над полем. Его содержимое можно переопределить default-слотом. Доступны быстрые props checked, label, name, rules и description, а полная настройка выполняется через formItemProps, alertProps и checkboxProps.