# Field

> This document is the Markdown version of [formisch.dev/vue/api/Field/](https://formisch.dev/vue/api/Field/). For the complete documentation index, see [llms.txt](https://formisch.dev/llms.txt).

Headless form field component that provides reactive properties and state. The field component takes a form store, path to field, and a scoped slot that receives a field store to display field state and handle user interactions.

```vue
<Field :of="…" :path="…" v-slot="field">
  <!-- Use field store here -->
</Field>
```

## Generics

- `TSchema` `extends FormSchema`
- `TFieldPath` `extends RequiredPath`

## Properties

- `of` `FormStore<TSchema>`
- `path` `ValidPath<v.InferInput<TSchema>, TFieldPath>`

## Slots

- `default` - Scoped slot that receives a [`FieldStore`](/vue/api/FieldStore.md) with reactive field state and props

### Explanation

The `Field` component is a headless component that doesn't render any UI itself. Instead, it provides a scoped slot that receives a [`FieldStore`](/vue/api/FieldStore.md) containing all the reactive state and props needed to render a form field.

The component automatically handles field registration, validation, and state management through the `of` prop that references the form store.

## Related

### Composables

[`useForm`](/vue/api/useForm.md), [`useField`](/vue/api/useField.md)

### Components

[`Form`](/vue/api/Form.md), [`FieldArray`](/vue/api/FieldArray.md)