vue-area-autosize
A Fork of vue-textarea-autoresize
with fixes and optimizations. This is a Vue component that provides textarea with automatically adjustable height and without any wrappers and dependencies
Finctionality
-
v-model
binding in parent - min/max height limitation
- enable/disable auto resizing dynamically
- with
@input.native
and@change.native
events
Note
- You are able to handle all native events via
@eventname.native
read more - There is no CSS from box, so you are free to style it as you wish
Install
Install with npm
npm install @bitsler/vue-area-autosize --save
or with yarn
yarn add @bitsler/vue-area-autosize
Adding into app
In your main.js
import Vue from 'vue'
import VueAreaAutosize from '@bitslervue-area-autosize'
Vue.use(VueAreaAutosize)
Usage
In components
<textarea-autosize
placeholder="Type something here..."
ref="someName"
v-model="someValue"
:min-height="30"
:max-height="350"
@blur.native="onBlurTextarea"
></textarea-autosize>
Focus/blur or select content in components
this.$refs.someName.$el.focus()
this.$refs.someName.$el.blur()
this.$refs.someName.$el.select()
Interface
Props
Props | Required | Type | Default | Description |
---|---|---|---|---|
autosize | false | Boolean | true | allow to enable/disable auto resizing dynamically |
minHeight | false | Number | null | min textarea height |
maxHeight | false | Number | null | max textarea height |
Events
Name | Params | Description |
---|---|---|
input | value | fires on textarea content changed. part of a v-model binding. read more
|
Slots
There are no slots available