fn
useTextareaAutosize
v0.0.14testeddemoAuto-resizes a <textarea> to fit its content. Reacts to user
input, programmatic content changes, and element resize. Reuses
useEventListener for a passive, auto-cleaned input listener and
useResizeObserver to re-measure when the textarea's width changes (so
reflowed text is re-fitted). SSR safe.
Examples
ts
const { textarea, input } = useTextareaAutosize();
// <textarea ref="textarea" v-model="input" />ts
const { textarea, input, triggerResize } = useTextareaAutosize({ maxHeight: 320 });Demo
Loading demo…
Signature
ts
export function useTextareaAutosize(options: UseTextareaAutosizeOptions ={ ... }Parameters
| Parameter | Type | Description |
|---|---|---|
options? | UseTextareaAutosizeOptions | Options |
Returns
UseTextareaAutosizeReturntextarea, input, and triggerResize| Property | Type | Description |
|---|---|---|
textarea | Ref<HTMLTextAreaElement | undefined | null> | The textarea element being autosized. Bind it with ref in the template |
input | Ref<string> | Two-way bound textarea content |
triggerResize | VoidFunction | Force a resize on demand (e.g. after a programmatic value change) |