https://github.com/syropian/vue-input-autosize

A simple Vue.js directive to autosize text input fields
https://github.com/syropian/vue-input-autosize

Last synced: 3 months ago
JSON representation

A simple Vue.js directive to autosize text input fields

• Host: GitHub
• URL: https://github.com/syropian/vue-input-autosize
• Owner: syropian
• License: mit
• Archived: true
• Created: 2016-07-24T15:05:33.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2017-08-22T23:02:29.000Z (over 7 years ago)
• Last Synced: 2024-07-18T07:51:43.845Z (6 months ago)
• Language: JavaScript
• Size: 22.5 KB
• Stars: 22
• Watchers: 5
• Forks: 6
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-github-vue - vue-input-autosize - 基于内容自动调整文本输入的大小 (实用库)
• awesome-github-vue - vue-input-autosize - 基于内容自动调整文本输入的大小 (实用库)
• awesome - vue-input-autosize - 基于内容自动调整文本输入的大小 (实用库)
• awesome-vue - vue-input-autosize - input-autosize?style=social) - 基于内容自动调整文本输入的大小 (实用库)

README

        
# vue-input-autosize [DEPRECATED]

## This package has been deprecated in favour of [vue-input-autowidth](https://github.com/syropian/vue-input-autowidth) that has support for Vue.js 2+ and a slew of bug fixes and improvements.

[![Build Status](https://travis-ci.org/syropian/vue-input-autosize.svg?branch=master)](https://travis-ci.org/syropian/vue-input-autosize)

> A simple Vue.js directive for autosizing a text input based on its content.

## Install

```js

$ npm install vue-input-autosize --save

```

**or** include the UMD build, hosted by [npmcdn](https://npmcdn.com) in a `` tag:

```js

<script src="//npmcdn.com/vue-input-autosize">

```

## Usage

```js

import Vue from "vue";

import VueInputAutosize from "vue-input-autosize";

Vue.use(VueInputAutosize, { maxWidth: 500, minWidth: 20, comfortZone: 0 });

```

...and inside your template:

``

### Why bind to `value` instead of using `v-model`?

Currently, there's no easy way to track changes to a `v-model` value from a directive. However, since the `value` property of a text field controls its content, and is also a valid parameter to watch for updates from the directive, we can dynamically bind to that instead.

## License

MIT © [Collin Henderson](https://github.com/syropian)