NotForm
Renders a form element and provides the form instance to all descendant fields.
<NotForm> renders a native <form> element and makes the instance available to all descendant <NotField>, <NotMessage>, and <NotArrayField> components through Vue's provide/inject. Any attribute you pass is forwarded to the underlying <form>.
Props
| Prop | Type | Required | Description |
|---|---|---|---|
form | NotFormInstance<any> | Yes | The instance created by useNotForm. |
Slots
| Slot | Description |
|---|---|
default | No slot props are passed. Place your fields and submit button here. |
Usage
Basic
Bind @submit to form.submit. This is required — it handles validation, calls onSubmit when valid, and calls event.preventDefault() automatically when validation fails or when onSubmit is defined.
<template>
<NotForm
:form="form"
@submit="form.submit"
>
<!-- fields and submit button -->
</NotForm>
</template>
With reset
Bind the native reset event to form.reset() to restore all values, clear errors, and reset touched/dirty state.
<template>
<NotForm
:form="form"
@submit="form.submit"
@reset="form.reset()"
>
<!-- ... -->
<button type="reset">
Clear
</button>
</NotForm>
</template>
Forwarding attributes
Any attribute or listener passes through to the <form> element.
<template>
<NotForm
:form="form"
class="space-y-4"
novalidate
autocomplete="off"
@submit="form.submit"
/>
</template>