安装
pnpm i vue-password-strength-meter zxcvbn
用法
固定用法
<template>
<password
v-model="password"
:toggle="true"
@score="showScore"
@feedback="showFeedback"
/>
</template>
<script>
import Password from 'vue-password-strength-meter'
export default {
components: { Password },
data(){
return{
password: null
}
},
methods: {
showFeedback ({suggestions, warning}) {
console.log('🙏', suggestions)
console.log('⚠', warning)
},
showScore (score) {
console.log('💯', score)
}
}
}
</script>
自定义用法
<template>
<div>
<input type="password" v-model="password">
<password v-model="password" :strength-meter-only="true"/>
</div>
</template>
<script>
import Password from 'vue-password-strength-meter'
export default {
components: { Password },
data(){
return{
password: null
}
}
}
</script>
props
