Vue Password Strength Component API

Password Strength API

Explore the API reference for the Vue Password Strength component and discover how to effectively utilize its props for customization.

On this page

CPasswordStrength

jsx
import { CPasswordStrength } from '@coreui/vue'

Props

PropertyDefaultType
busyLabel'Checking…'string

Text announced while an asynchronous scorer is pending.

debounce200number

Milliseconds to wait after the last change before evaluating.

levels() => ['Very weak', 'Weak', 'Fair', 'Good', 'Strong']string[]

Labels for the strength levels, weakest first. The meter renders one segment fewer than there are levels, and a score above the last label is clamped to it.

minLength8number

Minimum length the built-in scorer awards points for.

scorerundefined(password: string, userInputs: string[]) => StrengthResult, Promise<StrengthResult>

Custom scorer - return a score (or { score, warning, suggestions }), or a promise resolving to one.

thresholds() => [2, 4, 6]number[]

Point thresholds between the built-in scorer's levels. A threshold left out keeps its default.

userInputs() => []string[], (() => string[])

Words the password must not contain - the user's name, e-mail, the site name. Pass a function to read them lazily.

value''string

The password to evaluate.

weights() => ({ minLength: 1, extraLength: 1, longPassword: 1, lowercase: 1, uppercase: 1, numbers: 1, special: 1, multipleSpecial: 1, })Record<string, number>

Points the built-in scorer awards per fulfilled rule. A rule left out keeps its default, so the object is a set of overrides rather than a replacement.

Events

Event name
strength-change

Callback fired when the computed score changes. The password is masked.

  • score number | null
  • level string | null