Install

npm i ez-otp-input --save

or

yarn add ez-otp-input

Usage

Vue.use()

// Introduced in vue file
import EzOtpInput from 'ez-otp-input';
Vue.use(EzOtpInput);

Import Component

// Introduced in vue file
import { EzOtpInput } from 'ez-otp-input';

export default {
  name: 'MyComponent',
  ...
  components: {
    EzOtpInput
  }
}

Props

| Props | Type | Default | Description | | ----- | ---- | ------- | ----------- | | value | String |   | use v-model to automatically set your local value | | length | Number | 4 | sets the length of the OTP | | disable | Boolean | false | disables the input | | placeholder | String | -- | placeholder for each character input | | autoSubmit | Boolean | true | flag to trigger @filled event when model is equal to length |

Events

| Event | Param | Description | | ----- | ----- | ----------- | | filled |   | triggered when all input fields are filled up. Can be enabled/disabled via the autoSubmit prop |