The submit input uses HTML's native button element. The label prop is used to populate the text of the button — or alternatively you can use the default slot.
submit input uses a button element instead of an input=type"submit" because as a container element, a button can include content and pseudo elements — making them the more flexible option for developers.
The submit input (along with button) is unique in that it does not actively receive input other than a transient click. However, nearly all of the base input props still technically exist on the input.
Importantly the ignore prop is automatically set to true — meaning even if a submit is given a value, it will not communicate it with the parent form. However, this default behavior can be changed by setting the prop :ignore="false".
| Prop | Type | Default | Description |
|---|---|---|---|
| config | Object | {} | Configuration options to provide to the input’s node and any descendent node of this input. |
| delay | Number | 20 | Number of milliseconds to debounce an input’s value before the commit hook is dispatched. |
| errors | Array | [] | Array of strings to show as error messages on this field. |
| help | String | '' | Text for help text associated with the input. |
| id | String | input_{n} | The unique id of the input. Providing an id also allows the input’s node to be globally accessed. |
| ignore | Boolean | false | Prevents an input from being included in any parent (group, list, form etc). Useful when using inputs for UI instead of actual values. |
| label | String | '' | Text for the label element associated with the input. |
| name | String | input_{n} | The name of the input as identified in the data object. This should be unique within a group of fields. |
| preserve | boolean | false | Preserves the value of the input on a parent group, list, or form when the input unmounts. |
| sections-schema | Object | {} | An object of section keys and schema partial values, where each schema partial is applied to the respective section. |
| type | String | text | The type of input to render from the library. |
| validation | String, Array | [] | The validation rules to be applied to the input. |
| validation-visibility | String | blur | Determines when to show an input's failing validation rules. Valid values are blur, dirty, and live. |
| validation-label | String | {label prop} | Determines what label to use in validation error messages, by default it uses the label prop if available, otherwise it uses the name prop. |
| validation-rules | Object | {} | Additional custom validation rules to make available to the validation prop. |
| Section-key | Description |
|---|---|
| outer | The outermost wrapping element. |
| wrapper | A wrapper around the label and input. |
| label | The label of the input. |
| prefix | Has output by default, but allows content directly before an input element. |
| inner | A wrapper around the actual input element. |
| suffix | Has output by default, but allows content directly after an input element. |
| input | The input element itself. |
| help | The element containing help text. |
| messages | A wrapper around all the messages. |
| message | The element (or many elements) containing a message — most often validation and error messages. |