🔖 Vue.js 2.0 Input Tag Component
Switch branches/tags
Nothing to show
Clone or download

README.md

vue-input-tag

A Vue.js 2.0 input tag component inspired in react-tagsinput

Codeship Coverage Status Version License Monthly Downloads

Logo

Installation

NPM / Yarn

npm install vue-input-tag --save
yarn add vue-input-tag

Then you need to import and register it:

import InputTag from 'vue-input-tag'
Vue.component('input-tag', InputTag)

CDN

<script src="https://unpkg.com/vue"></script>
<script src="https://unpkg.com/vue-input-tag"></script>

Then you need to register it:

Vue.component('input-tag', vueInputTag.default)

Usage

<input-tag :tags.sync="tagsArray"></input-tag>

Props

Name Type Default Description
tags Array [] Tags to be render in the input
placeholder String "" Placeholder to be shown when no tags
read-only Boolean false Set input to readonly
addTagOnBlur Boolean false Add tag on input blur
limit String or Number -1 (none) Set a limit for the amount of tags
validate String or Function or Object "" Apply certain validator for user input. Choose from email, url, text, digits or isodate. Or pass a function or a RegExp object for custom validation
addTagOnKeys Array [ 13 (return), 188 (comma), 9 (tab) ] Keys that are going to add the new tag
allowDuplicates Boolean false Allow duplicate tags