mirror of
https://github.com/directus/directus.git
synced 2026-02-15 18:24:59 -05:00
* move component docs to documentation * update app docs tables for components * update docs * Add components to docs sidebar * fix generated tables * fix tables * rename transitions * update tables * update nested components * update tables * update tables * update tables * update v-table table * add basic documentation to each component * remove all stories of storybook * add missing documentation * undate tables * update tables * update docs sidebar * update app docs * remove unused references * add general readme * update docs * make reference titiles smaller * add reference tag * improve docs * update order of tabs in sidebar * remove all readmes and stories from interfaces/displays * Cleanup menu * Remove storybook Co-authored-by: rijkvanzanten <rijkvanzanten@me.com>
53 lines
2.5 KiB
Markdown
53 lines
2.5 KiB
Markdown
# Textarea
|
|
|
|
Renders a textarea in which multiline text can be entered.
|
|
|
|
```html
|
|
<v-textarea v-model="value" />
|
|
```
|
|
|
|
## Attributes & Events
|
|
|
|
The HTML `<textarea>` element supports a huge amount of attributes and events. In order to support all of these, all
|
|
props that aren't specially handled (see list below) will be passed on to the `<textarea>` element directly. This allows
|
|
you to change anything you want on the input.
|
|
|
|
## Reference
|
|
|
|
#### Props
|
|
|
|
| Prop | Description | Default | Type |
|
|
| ----------------- | ------------------------------------------------------------------------------ | ------- | --------- |
|
|
| `placeholder` | Text to show when no input is entered | `null` | `String` |
|
|
| `autofocus` | Autofocusses the input on render | `false` | `Boolean` |
|
|
| `disabled` | Set the disabled state for the input | `false` | `Boolean` |
|
|
| `full-width` | Render the input with 100% width | `true` | `Boolean` |
|
|
| `value` | Current value. Syncs with `v-model` | `null` | `String` |
|
|
| `expand-on-focus` | Renders the textarea at regular input size, and expands to max-height on focus | `false` | `Boolean` |
|
|
| `trim` | Trim leading and trailing whitespace | `false` | `Boolean` |
|
|
|
|
Note: all other attached attributes are bound to the input HTMLELement in the component. This allows you to attach any
|
|
of the standard HTML attributes like `min`, `length`, or `pattern`.
|
|
|
|
#### Slots
|
|
|
|
| Slot | Description | Data |
|
|
| --------- | -------------------------------------------------------- | ---- |
|
|
| `prepend` | Prepend elements before the text content in the textarea | |
|
|
| `append` | Append elements after the text content | |
|
|
|
|
#### CSS Variables
|
|
|
|
| Variable | Default |
|
|
| -------------------------- | -------------------------- |
|
|
| `--v-textarea-min-height` | `none` |
|
|
| `--v-textarea-max-height` | `var(--input-height-tall)` |
|
|
| `--v-textarea-height` | `var(--input-height-tall)` |
|
|
| `--v-textarea-font-family` | `var(--family-sans-serif)` |
|
|
|
|
#### Events
|
|
|
|
| Event | Description | Value |
|
|
| ------- | ----------- | ----- |
|
|
| `input` | | |
|