@bitsler/vue-area-autosize

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

License

MIT