Vue password: realistic password strength estimator

vue-password-strength-meter

Interactive password strength meter based on zxcvbn for Vue.js. Import it in your project as a Vue component, and use props to customize it.

Example

Install

npm install vue-password-strength-meter

or

yarn add vue-password-strength-meter

Usage

<script>
import Password from 'vue-password-strength-meter'

export default {
  data () {
    return {
      placeholder: 'enter 6 characters or more',
      secureLength: 6, // minimum password
    }
  },
  components: {
    Password
  },
}
</script>

Bind to props to adjust the meter.

<template>
<div id="app">
<div>
    <password :placeholder="placeholder" :secureLength="secureLength"></password>
</div>
</div>
</template>

The above code will result in:

You can find a Demo here. The code is available on GiHub.